body, html, .ccm-page h1, .ccm-page h2,.ccm-page h3, .ccm-page h4, .ccm-page h5, .ccm-page h6 { font-family: 'Montserrat', sans-serif; }
.ccm-page h4 {color: #005A8C;letter-spacing:4px;text-transform:uppercase;}
.ccm-page .accessibilty-hide { position: absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
.ccm-page .row { margin: 0 auto; max-width: 90%; }
a { transition: background-color .15s, color .15s; }

a img {
-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;
}
a:hover img {opacity:0.8;}

#banner {background-color:#005A8C;height:80px;position:fixed;width:100%;z-index:3;-webkit-box-shadow: 0px -2px 11px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px -2px 11px 0px rgba(0,0,0,0.75);
  box-shadow: 0px -2px 11px 0px rgba(0,0,0,0.75);}
  #banner .row {max-width:100%}
  #bannerleft {float:left;width:150px;margin-left:20px;}
  #bannermiddle {padding-right:40px;padding-top:30px;}
  #bannermiddle ul {font-size:1.3rem;}
#bannerright {float:left;width:140px;}
#bannerrightcontainer {float:right;width:auto;}

#topbanner {height:470px; background-image:url('../images/bg.png');background-size:cover;background-position:bottom center;}
#topbanner.newnew {  height: 270px;background-position:bottom center;}
#topbanner .row {position: relative;}
#topbanner .row p {text-align:center; margin:0 auto;
  margin-top: 18%;}
#topbanner .row p a {padding:20px 30px;background-color:#DB2C29;color:white;font-size:1.4em;font-weight:bold;letter-spacing:3px;border:3px white solid;-webkit-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);
box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);
-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;
}
#topbanner .row p a:hover {background-color:#B11F1D;-webkit-box-shadow: 0px 0px 7px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 7px 1px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 7px 1px rgba(0,0,0,0.75);
    -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;}



#bannerleft img {max-height:50px;width:auto;margin-top:15px;min-width: 150px;}
#bannermiddle ol, #bannermiddle ul{list-style: none;}
#bannermiddle li {display:block;
	width:auto;
	float:left;
	margin-left: 40px;font-size:.7em;text-transform:uppercase;}
#bannermiddle ul li a {color:white;  -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;}

#bannermiddle ul li {float:right}
#bannermiddle li:last-of-type {margin-left:0px;}
#bannermiddle ul li a:hover {color:#71C2FF;}

.login-logout-link::before {content:url('../images/logout.png');padding-top:2px;display:block;float:left;}
.login-logout-link {margin-top:15px;padding:10px;width:120px; border:white solid 1px;}
.login-logout-link a {padding-left:10px; color:white;-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;}
  .login-logout-link {-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;}
  .login-logout-link:hover {cursor:pointer;background-color:rgba(255,255,255,0.2);}
  #midbannertop {height: auto; background-color:#CCE9FF;position:relative;}
#midbannertop .small-2 img {position:absolute;width:200px;margin:0 auto;top:-60px}
#midbannertop p {text-align:center;margin-top:25px;font-size:1.2em;font-weight:bold;color:#005A8C;letter-spacing:3px;}
#midbannerbottom {background: rgb(24,143,210);
  background: linear-gradient(128deg, rgba(24,143,210,1) 33%, rgba(0,90,140,1) 100%);text-align:center;padding-top:56px; padding-bottom: 90px;}
  #midbannerbottom h2, #midbannerbottom p {color:white;letter-spacing:3px}
  #midbannerbottom h2 {font-weight:bold;font-size:1.5em;}
  #bottombanner .row.collapse {max-width:100%}
.expandme {height:0px;overflow:hidden;transition: height 0.4s linear;}
  #bottombanner {text-align:center;transition: height 0.4s linear;}
  #banbottomleft {background-image:url('../images/banbottomleft.jpg');background-size:cover;background-position:bottom center;}
  #banbottomright {background-image:url('../images/banbottomright.jpg');background-size:cover;background-position:bottom center;}
  #banbottomleft, #banbottomright {padding:70px 30px 30px 30px;position:relative;transition: height 0.4s linear;}
  #bottombanner img{position:absolute;width:150px;left: 50%;
    margin-left: -75px;top:-75px}
#bottombanner h3, #bottombanner p {color:white;}
#bottombanner p {margin-bottom:20px;}
#bottombanner h3 {font-weight:bold;margin-bottom:25px;}
.smallredbtn {padding:10px;color:white;font-size:.9em;letter-spacing:3px;font-weight:bold;background-color:#DB2C29;-webkit-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);border:white solid 1px;-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;}
  .smallredbtn:hover {color:white;background-color:#B11F1D;}
  #bottombanner {height:auto;transition: height 0.4s linear;}
  #banbottomleft, #banbottomright {height:60%;transition: height 0.4s linear;}
  .showingcont #banbottomleft, .showingcont #banbottomright {height:100%;transition: height 0.4s linear;}
.expandme {height:0px;overflow:hidden;transition: height 0.4s linear;}
.smallredbtn span::before {content: 'Learn More';}
.showing .smallredbtn span::before {content: 'Close';}
#banbottomleftexpand, #banbottomrightexpand {transition: height 0.4s linear;}
#banbottomleft.showing #banbottomleftexpand {height:auto;transition: height 0.4s linear;}
#banbottomright.showing #banbottomrightexpand {height:auto;transition: height 0.4s linear;}
.smallredbtn:focus{color:white;}
#banbottomrow {background-image:url('../images/bg2.jpg');background-size:cover;background-position:bottom center;padding:30px 6%}
#banbottomrow h3, #banbottomrow p {color:#013653;}
#banbottomrow p {font-weight:bold;}
#subbanner {background-image:url('../images/bg.png');background-size:cover;background-position:center 65%;height:270px;position:relative;}
#bannercontent {width:80%;left: 50%; transform: translateX(-50%);text-align:center;background-color:#013653;position:absolute;height:140px;bottom:-40px}
#bannercontent img {width:100px;position:absolute;top:-50px;margin-left: -50px;}
#bannercontent h1 {color:white;margin-top:60px;font-weight:bold;letter-spacing:8px;}
#subbody {    margin-top: 100px;
  margin-bottom: 140px;
  margin-left: 10%;
  margin-right: 10%;}

  
 #body-container {margin-top:80px;margin-bottom:50px;}
 #registerme .form-stacked .row{max-width:100%}
#registerme .form-stacked .columns {padding:0px;}
#registerme .form-stacked fieldset {border: none;margin:0;padding:0}
#registerme .form-stacked .control-label {font-weight:bold; color:#013653;margin-top:30px;}
#registerme .form-stacked .control-label {font-weight:bold; color:#013653;margin-top:30px;display:inline-block}
#registerme .form-stacked .text-muted.small {color:red;font-size:.6em;display:inline;}
#registerme .form-stacked input[type=submit] {padding:15px 25px; background:#DB2C29; color:white;border:0 none;
  cursor:pointer;
  -webkit-border-radius: 5px;
  border-radius: 5px; text-transform:uppercase;font-weight:bold;-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:50px;margin-top:20px;}
#registerme .form-stacked input[type=submit]:hover {color:white;background-color:#B11F1D;}
.registersidebar {padding:30px;text-align:center;background-color:#CCE9FF;}
.registersidebar h5 {font-weight:bold;color:#3C3C3C;text-transform:uppercase;margin-bottom:20px;}
.registersidebar h4 {font-size:1.3em;text-transform:none;font-weight:bold;margin-bottom:25px;}

#banbottomrow {}

#newbuttons  {display:flex;gap:20px;justify-content:center;align-items:center;background-image:url('https://bimforbridgesus.com/application/themes/aashto/images/banbottomright.jpg');
  background-size: cover;
  background-position: center;flex-wrap: wrap;
  align-items: stretch;}

#newbuttons div  {padding:20px;flex: 1 0 15%;}

#newbuttons div a {display:flex;flex-direction:column;align-items:center;gap:20px;}
#newbuttons div a span {background-color:#DB2C29;padding:10px;width:100%;text-align:center;color:white;font-weight:bold;    -webkit-box-shadow: 0px 0px 14px 1px rgb(0 0 0 / 75%);
  -moz-box-shadow: 0px 0px 14px 1px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 14px 1px rgb(0 0 0 / 75%);
  border: white solid 1px;-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;}
  #newbuttons div img {max-width:150px;}
#newbuttons div a span:hover {background-color: #B11F1D;}
#footer {width:100%;background-color:#3C3C3C;height:55px;color:white;text-align:center;padding-top:15px;
       
  overflow: hidden;
}
#footer p {font-size:.8em;}
.whitelink a{color:white}  
.ccm-page .document-block {
  position: relative;
  filter: drop-shadow(0px 4.06044px 4.06044px rgba(0, 0, 0, 0.25));
}

.ccm-page .document-block>div {
  height: 15vw;
  width: 100%;
  overflow: hidden;
}

.ccm-page .document-block>div h6 {
  position: absolute;

  display: inline-block;
  background-color: #006992;
  color: #FFF;
  font-size: 0.75em;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0em;
  text-align: left;

  top: 0;
  left: 0;
  margin: 0;
  padding: 5px;
}
.ccm-page .document-block>div img {
  display: block;
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.ccm-page .document-block a {
  position: relative;
  display: block;
  background-color: #FFF;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 60px;
  padding-right: 20px;
  font-style: normal;
  font-weight: bold;
  font-size: 1.25em;
  line-height: 1.26em;
  color: #013653;
  transition: background-color 300ms;
}

.ccm-page .document-block a:hover {
  background-color: #eee;
}

.ccm-page .document-block a::after {
  content: "";
  background-image: url('https://bimforbridgesus.hdrstratcommtest.com/application/files/1616/4513/3212/07.png');
  background-size: cover;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 28px;
  height: 28px;
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);

}

.section-header h2 {
  display: block;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
  padding-top: 17px;
  border-top: 6px solid #DADADA;

  font-size: 2em;
  font-style: normal;
  font-weight: 400;
  line-height: 38px;
  line-height: 2.375em;
  text-align: center;
  text-transform: uppercase;
  color: #005A8C;
}

.presentation-link a {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  margin-bottom: 15px;
  background-color: #FFF;
  filter: drop-shadow(0px 4.06044px 4.06044px rgba(0, 0, 0, 0.25));
  border-left: 5px solid #013653;
  font-size: 1.3em;
  color: #005A8C;
  padding-right: 28px;
  transition: background-color 300ms;
}

.presentation-link a:hover {
  background-color: #eee;
}

.presentation-link a span {
  display: block;
  font-weight: 600;
}

.presentation-link a em {
  display: inline-block;
  margin-left: auto;
  font-size: 1em;
  font-weight: normal;
}

.presentation-link a img {
  height: 62px;
  width: auto;
  background-color: #DAF2FF;
  padding: 8px;
  margin-right: 5px;
}

.link-block {
  width: 100%;
  background-color: #FFF;
  filter: drop-shadow(0px 4.06044px 4.06044px rgba(0, 0, 0, 0.25));
  border-top: 12px solid #005A8C;
  padding: 20px 12px;
  margin-bottom: 20px;
  min-height: 240px;
}

.link-block h5 {
  color: #005A8C;
  margin-bottom: 20px;
}

.link-block a {
  color: #FFF;
  background-color: #DB2C29;
  display: inline-block;
  padding: 8px;
  min-width: 100px;
  transition: background-color 300ms;
}

.link-block a:hover {
  background-color: #92201f;
}

/* NEW RESOURCES */

.newresources h2 {font-size:1.7em;position:relative;margin-bottom:25px;color:#013653;font-weight:bold}
.newresources h2:before {content:'';display:block;width:70px;height:7px;background-color:#db2c29;position:absolute;bottom:-6px}
.newresources ul {margin:0;}

.newresources ul li {list-style:none}
.newresources .statedot-bridge ul {  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; align-items:stretch;flex-direction:column;}
.newresources .statedot-bridge ul li { flex: 1 0 30%; margin: 5px;background-color:white;  padding:8px 20px 10px 47px;position:relative;}
.newresources .statedot-bridge ul li:before {content:'';width:100%;background-color:#005A8C;height:3px;position:absolute;top:0;left:0; }
.newresources .statedot-bridge ul li:after {content:'';width:0;background-color:#db2c29;height:3px;position:absolute;top:0;left:0; -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;}
.newresources .statedot-bridge ul li:hover {}
.newresources .statedot-bridge ul li a {font-weight:bold;font-size:.9em;-webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;border-bottom:dotted 2px white}
.newresources .statedot-bridge ul li a:before {content:url('https://bimforbridgesus.com/application/files/9616/7457/4854/red-doc.svg');position:absolute;width:30px;height:30px;background-color:#DB2C29;top:0;left:0;}
.newresources .statedot-bridge ul li:hover:after {width:100%}

.newresources .statedot-bridge ul li a:hover {border-bottom:dotted 2px #db2c29}

.newresources .prezzies {padding:20px 30px;background-color:#eeeeee;border-radius:5px;border:dashed gray 2px;margin:20px 5px;}
.newresources .prezzies h3 {text-transform:uppercase;font-size:1.2em;font-weight:bold}

.newresources .prezzies li {position:relative;background-color:white;margin-bottom:20px;height:34px;display:flex;  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;}

.newresources .prezzies li:before {content:url('https://bimforbridgesus.com/application/files/2516/7457/5815/prezzies.svg');top:-1;left:0;position:absolute;}

.newresources .prezzies li {padding:5px 10px 5px 50px;filter: drop-shadow(0px 4.06044px 4.06044px rgba(0, 0, 0, 0.25));}
.newresources .prezzies li a {display:flex;align-items:center;font-weight:bold;font-size:.9em}
.newresources .prezzies li a span.pdate{font-weight:normal;font-size:.7em;background-color:#eeeeee;padding:2px 14px;border-radius:30px;color:black;margin-left:10px;}
.newresources .nchrp-state {padding:20px 30px;background-color:#F0F9FF;border-radius:5px;border:dashed gray 2px;margin:20px 5px;}

.newresources .prezzies li:hover {border-left:4px #db2c29 solid}

.newresources .software ul, .newresources .committee-web ul, .newresources .fhwa-resources ul {display: flex;
  justify-content: space-between;
  flex-wrap: wrap; align-items:stretch}
 .newresources .software li,  .newresources .committee-web li,  .newresources .fhwa-resources li {
flex: 1 0 20%;text-align:center;margin: 5px;

    background-color: #FFF;
    filter: drop-shadow(0px 4.06044px 4.06044px rgba(0, 0, 0, 0.25));
    border-top: 8px solid #005A8C;
    padding: 20px 12px;
    margin-bottom: 20px;
position:relative;
-webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;

}
 .newresources .software li:hover,  .newresources .committee-web li:hover,  .newresources .fhwa-resources li:hover {   border-top: #db2c29 12px solid ;}
 .newresources .software li a,  .newresources .committee-web li a,  .newresources .fhwa-resources li a {display:block;font-weight:bold;-webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;border-bottom:dotted 2px white}

 .newresources .software li a:hover,  .newresources .committee-web li a:hover,  .newresources .fhwa-resources li a:hover{border-bottom:dotted 2px #db2c29}

 .newresources .software li a:before, .newresources .committee-web li a:before, .newresources .fhwa-resources li a:before {content:url('https://bimforbridgesus.com/application/files/5416/4521/0030/Group_113.png');position:relative;display:block;margin-bottom:20px;}


 .newresources .nchrp-state ul {display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;flex-direction:column;}
 .newresources .nchrp-state ul li {padding:10px 0px;border-bottom:dashed gray 1px;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;}
 .newresources .nchrp-state ul li:hover {border-bottom:solid red 3px;}
 .newresources .nchrp-state ul li:hover a {color:#013653}
 .newresources .nchrp-state ul li:last-of-type {border:none;}
 .newresources .nchrp-state ul li a {color:#005A8C;font-weight:bold;display:flex;align-items:center;gap:20px;-webkit-transition: all 400ms ease-in-out;
  -moz-transition: all 400ms ease-in-out;
  -o-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;}
 .newresources .nchrp-state ul li a:before {content:url('https://bimforbridgesus.com/application/files/5816/7458/0001/linky.svg');display:block;}


 @media only screen and (max-width: 1250px) {#newbuttons div  {padding:20px;margin:20px;flex: 1 0 25%;}}
@media only screen and (max-width: 960px) {
  #midbannertop p {font-size: .9em;letter-spacing: 2px;}
  #midbannertop .small-2 img {top:-40px;}
  p {font-size:.9em;}
  .ccm-page .document-block a {
    font-size: 1em;
    line-height: 1em;
  }
}

@media only screen and (max-width: 900px) {
  #midbannertop p {margin-top: 15px;}
  #midbannertop .small-2 img {top:-30px;}
  #midbannerbottom {    padding-top: 26px;}
}

@media only screen and (max-width: 960px) {

   .newresources .software li, .newresources .committee-web li, .newresources .fhwa-resources li {
  flex: 1 0 40%;}

  .newresources .statedot-bridge ul li {flex: 1 0 30%;}

  .newresources .prezzies ul {align-items:stretch;}
  .newresources .prezzies li {height:auto}
  .newresources .prezzies li a {flex-direction:column;justify-content:start;align-items:flex-start}
  .newresources .prezzies li a span:first-of-type {margin-bottom:10px}
  .newresources .prezzies li a span:last-of-type {margin:0}
  #banner {    top: 0;}
  #bannerleft {float: left;}
    #bannerrightcontainer { }
    #bannermiddle {    float: right;
    }
    #bannermiddle ul {font-size:.9rem;}
      #bannerright {
       display:none;
    }
    .login-logout-link {    padding: 5px;    width: 110px;}
    p.login-logout-link {margin-right:0px;}
    #topbanner {height:300px;margin-top: 80px;}
    #bottombanner p {margin-bottom:10px;font-size:.8em;}
    .presentation-link a {
      flex-wrap: wrap;
      padding-left: 15px;
      padding-right: 0px;
      padding-bottom: 10px;
      border-left: 0;
      border-top: 5px solid #013653;
    }

    .presentation-link a img {
      margin-left: auto;
      margin-right: 0;
    }

    .presentation-link a span {
      width: 100%;
      margin-right: 5px;
    }
    .presentation-link a em {
      width: 100%;
      margin-right: 5px;
    }

}

@media only screen and (max-width: 640px) {
  #midbannertop .small-2 {display:none;}
  #midbannertop {height:auto;}
  #midbannerbottom {height:auto;}
  #midbannertop p {margin:0px;font-size:.9em}
  p {font-size:.8em;}
  #bottombanner img {    position: relative;
    margin: 0 auto;left:0;top:0;}
    #bannermiddle {padding-right: 10px;}
    #bannerleft img {
      max-height: 30px;
      margin-top: 25px;
      min-width: 100px;
  }
    #bannermiddle li {
      margin-left: 20px;}
    #banbottomleft, #banbottomright {padding-top:30px;height:70%;}
    .showingcont #banbottomleft, .showingcont #banbottomright {height:120%;}
    #banner {position:relative;}
    #topbanner {margin-top:0px;height: 200px;}
    #topbanner .row p {margin-top: 20%;}
    #topbanner .row p a {font-size: 1.1em;    padding: 15px 20px;    border: 2px white solid;}
    #midbannertop {padding-top:10px;padding-bottom:10px;}
  .ccm-page .document-block>div {
    height: 42vw;
  }

  .section-header h2 {
    font-size: 1.5em;
    line-height: 1.55em;
  }
}