#main-header{
  background-image: url("../img/transportation_header.jpg");
}

/*showcase title bar section*/
#titleBar{
  text-align: center;
  background-color: white;
  color: #0d4077;
  padding: 1.4em 1em 1.4em 1em;
  margin: 0;
}

.singleTitle{
  font-size: 1.2em;
}

.singleTitle a{
  color: #0d4077 !important;
}

.singleTitle p{
  margin: 0;
  line-height: 1;
}

#leftTitle{
  border-right: 1px solid #0d4077;
}

#rightTitle{
  border-left: 1px solid #0d4077;
}

/*showcase display section*/
#displayContainer{
  position:relative;
  height: 30em;
  width: 100%;
}

.disBlockInfo{
    height: 100%;
    background-color: rgba(13,64,119,.5);
    color: white;
    padding: 5em !important;
    transition: 2s;
    font-size: .95em;
}

.disBlockInfo p, .disBlockInfo ul{
  margin: 0 !important;
}

.blockArrow{
  position:absolute;
  top:0;
  width: 2em;
  z-index: 10;
}

#blockaArrow{
  margin-left:25%;
}

#blockbArrow{
  margin-left:75%;
}

#block1Arrow{
  margin-left:15.5%;
}

#block2Arrow{
  margin-left:49%;
}

#block3Arrow{
  margin-left:82.5%;
}

#displayBlock1{
  background-image: url('../img/transportation_TIP.jpg');
}

#displayBlock2{
  background-image: url('../img/transportation_transportationplan.jpg');
}

#displayBlock3{
  background-image: url('../img/transportation_initiatives.jpg');
}

.displayBlock{
  position: absolute;
  height: 100%;
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.blockBtn{
  width: 30%;
  padding: 0 !important;
  text-align: center;
  font-size: .8em;
  margin: .3em;
}

@media only screen and (max-device-width: 736px) {
  #displayContainer{
    height: 37em;
  }

  #titleBar, #displayContainer{
    font-size: .8em !important;
  }
  /*these two tier off of the font size above*/
  .medTitle{
    font-size: .75em !important;
  }
  .longTitle{
    font-size: .65em !important;
  }
}

/*thin blue blocks*/
/*.thinBlock{
  padding: 2em 0 2em 0;
}

@media only screen and (max-device-width: 736px) {
  .thinBlock{
    padding: 1em 0 1em 0;
  }
}
*/
.thinBlock h3, .thinBlock p{
  margin: 0 !important;
}

.thinBlockTitle{
  text-align: right !important;
}

/*freight block styling*/
.freightRow, .freightRow h2{
  margin: 0 !important;
}

.freightCol{
  padding: 0 4em 0 0 !important;
}

@media only screen and (max-device-width: 736px) {
  .freightCol{
    padding: 1em !important;
  }
}

/*active transpo styling*/
.activetrans{
    background-image: url("../img/activetrans_img.jpg");
    background-position: center;
    background-size: cover;
}

#activeTranspoPic{
  height: 70em;
  padding: 0 !important;
  background-image: url("../img/active-transportation.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#activeTranspoDesc{
  padding: 6em 6em 6em 3em !important;
}

/*regional transit section*/

.regTransBlock p{
  margin: 0 !important;
}

.dividerRow {
  padding: 0 6em 0 6em;
  margin: 0 !important;
}


@media only screen and (max-device-width: 736px) {
  .regTransBlock a{
    margin-top: 1em !important;
  }
  .dividerRow{
    padding: 0 1em 0 1em;
  }
  .mobileLessTop{
    padding-top: 0 !important;
  }
  .mobileLessTop h3{
    margin: 0 !important;
  }
}
