
.navbar {
  padding-top:20px;
  background: #e6e6e6;
  height:60px;
  z-index: 2;
  font-family: "Lora", serif;


}


.navbar a {
  color: #737373;
}
.navbar a:hover {
  cursor: pointer;
}
.landing-page {
  position: absolute;
  top: 60px;
  left: 0px;
  width:100%;
  margin-top: 20px;

}
.white-background{
  background:white;
}
.mission p {
  color: #737373;
  margin-top: 20px;
  font-size: 20px;
  font-family: "Open Sans", sans-serif;
}

.full-screen img {
  width: 100%;
}
.background-image{
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;

  /* Preserve aspet ratio */
  min-width: 100%;
  min-height: 100%;

}
.nav-heading {
  margin-top: 10px;
  margin-bottom: 35px;
  font-family: "Lora", serif;
  text-transform: uppercase;

}


.nav-heading h2 {
  font-weight: bold;
  color: white;
  padding: 65px;
}


.nav-heading-container {
  margin-top: 20px;
  margin-bottom: 20px;
}
.service-list {
  margin-bottom: 35px;
}
.service-column {
  padding-left: 20px;
  padding-right: 20px;
}
.service-list h4 {
  color: #737373;
  text-transform: uppercase;
  margin-top: 20px;
  font-family: "Open Sans", sans-serif;
  font-size: 25px;
  padding: 5px;
}

#advantage {
  opacity: 0.5;
}

.advantage-box {
  border-color: #36743F;
  border-style: double;
  border-width: 10px;
}
.advantage {
  margin-left: 40px;
  margin-right: 40px;
  margin-top: 40px;
}


.advantage p, h4 {
  font-size: 25px;
  color: #737373;
  font-family: "Open Sans", sans-serif;
}

.advantage h3 {
  color: #05094F;
  font-family: "Lora", sans-serif;
  font-size: 33px;
}


.focus-image {
  width: 200px !important;
  height: 200px;
  margin-left: auto;
  margin-right: auto;
}


.star {
  padding:30px;
  position: relative;
  width: 25% /* for IE 6 */
}
.emph-green h3{
  color:#36743F;
  font-size: 20px;

}

.star-emph-green {
  color:#36743F !important;
  font-size: 36px !important;
  font-weight: bolder !important;

}
.emph-green h2{
  position: absolute;
  top: 22%;
  left: 0;
  width: 100%;
  color:#36743F;
  font-size: 43px;
  font-family: "Lora", serif;
}

.emph-green h4{
  color:#36743F;
  font-size: 40px;
}
.emph-blue h3 {
  color:#05094F;
  font-size: 20px;
}
.emph-blue h2 {
  position: absolute;
  top:22%;
  left: 0;
  width: 100%;
  color:#05094F;
  font-size: 43px;
  font-family: "Lora", serif;
}

.small-logo img {
  width: 300px;
  margin-top: 25px;
  margin-bottom: 25px;
}

.areas {
  background: #e6e6e6;
  padding: 20px;
  margin-top: 15%;
  opacity: .5;
}

.areas p {
  font-size: 22px;
  color: black;
  font-family: "Open Sans", sans-serif;

}
.timeline {
  background: #a8a9c0;
  line-height: 50px;
}

.timeline-container{
  margin-left: 100px;
  margin-right: 100px;


}
.timeline-content {
  width:100%;
  height: 800px;
  background-image: url('../images/PH1 JMH Truck.jpg');
  background-size: cover;
}
.timeline-text {
  background: white;
  opacity: .7;
  color: #05094F;
  width: 75%;
  position:relative;
  top: 10%;
  left: 10%;
  padding: 15px;
  font-size: 18px;
  font-family: "Open Sans", sans-serif;
}

.sareas {
  background:#505283;
}
#timeline-header, #timeline-header-two{
  font-weight: bold;
}
.timeline-container .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.timeline button{
  width: 50%;
  padding-top: 20px;
  padding-bottom: 20px;
  background: transparent;
  border:none;
  font-family: "Open Sans", sans-serif;
  font-size: 25px;
}
.selected {
  font-size: 50px;
}
.unselected button {
  font-size: 10px;
}
.timeline button:hover {
  font-size: 30px;
  font-weight: bold;
}
.port-image img {
  width:600px;
}

.contact {
  margin-bottom: 40px;

}
.contact img {
  width: 200px;
}

.contact h4 {
  font-family: "Open Sans", sans-serif;
  color: #737373;
  font-size: 20px;
  text-transform: uppercase;

}

.contact h5 {

  font-family: "Open Sans", sans-serif;
  color: #737373;
  font-size: 18px;
}

.contact a {
  font-family: "Open Sans", sans-serif;
  color:#469752;
  font-size: 18px;

}

.contact a:hover {
  color:#05094F;
}

.lower {
  margin-top: 100px;
}

.social-media i {
  font-size: 50px;
  margin-right: 15px;
}
.facebook i {
 color: #3B5998;
 opacity: .7;
}

.twitter i {
  color: #00aced;
  opacity: .7;
}

.linkedin i {
  color: #007bb6;
  opacity: .7;
}

.facebook i:hover {
 color: #3B5998;
 opacity: 1;
}

.twitter i:hover {
  color: #00aced;
  opacity: 1;
}

.linkedin i:hover {
  color: #007bb6;
  opacity: 1;
}


#advantage, #service-areas, #about{
    background: #05094F;

}
#services, #portfolio, #contact{
  background: #36743F;
}

#portfolio{
  opacity: .5;
}
.nav-footer {
  padding-top:20px;
    background: #e6e6e6;
    height:60px;
    font-family: "Lora", serif;
    font-size: 18px;
}
