#collapsedMenu {
    text-transform: uppercase;
}

header.masthead {
    text-align: center;
    color: white;
    background-image: url("app/img/bg-background.jpg");
    background-repeat: no-repeat;
    -webkit-background-position: center center;
    -moz-background-position: center center;
    -o-background-position: center center;
    background-position: center center;
    
    min-height: 600px;
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

header.contact-me {
    text-align: center;
    color: white;
    background-image: url("app/img/contact.jpg");
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

header.masthead .intro-text {
    padding-top: 10%;
    padding-bottom: 50px;
}

header.masthead .intro-text .intro-lead-in {
    font-size: 22px;
    font-style: italic;
    line-height: 22px;
    margin-bottom: 25px;
    font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

header.masthead .intro-text .intro-heading {
    font-size: 50px;
    font-weight: 700;
    line-height: 50px;
    margin-bottom: 25px;
    font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    text-transform: uppercase;
}

.social {
    margin: 30px;
}
@media (min-width: 768px) {
    header.masthead .intro-text {
        padding-top: 20%;
        padding-bottom: 200px;
        position: relative;
    }
    header.masthead .intro-text .intro-lead-in {
        font-size: 40px;
        font-style: italic;
        line-height: 40px;
        margin-bottom: 25px;
        font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
        text-shadow: 0 -1px  12px #004DB1;
    }
    header.masthead .intro-text .intro-heading {
        font-size: 75px;
        font-weight: 700;
        line-height: 75px;
        margin-bottom: 40px;
        font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
        text-transform: uppercase;
        text-shadow: 0 -1px  12px #004DB1;
    }
}
#mainNav {
    background-color: transparent;
}

.downArrow {
    position: absolute;
    bottom: 0;
    left: 48%;
    margin: 0 auto;
    text-shadow: 0 -1px  12px #004DB1;
}
#about {
    background: #e3e3e3; /* Old browsers */
  background: -moz-linear-gradient(top, #b2b2b2 0%, #fcfcfc 10%, #fcfcfc 95%, #b2b2b2 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #b2b2b2 0%,#fcfcfc 10%,#fcfcfc 95%,#b2b2b2 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #b2b2b2 0%,#fcfcfc 10%,#fcfcfc 95%,#b2b2b2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
section h2.section-heading {
    visibility: hidden;
    font-size: 40px;
    margin-top: 60px;
    margin-bottom: 15px; }

    section h3.section-subheading {
      visibility: hidden;
    font-size: 16px;
    font-weight: 400;
    font-style: italic;
    margin-bottom: 30px;
    text-transform: none;
    font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif; }

.service-heading {
  margin: 15px 0;
  text-transform: none; }

#portfolio h2.section-heading {
  color: #fff;
}

#portfolio h3.section-subheading {
  color: #fff;
}
#portfolio .portfolio-item {
  right: 0;
  margin: 0 10px 15px; }
  #portfolio .portfolio-item .portfolio-link {
    position: relative;
    display: block;
    max-width: 400px;
    margin: 0 auto;
    cursor: pointer; }
    #portfolio .portfolio-item .portfolio-link .portfolio-hover {
      position: absolute;
      width: 100%;
      height: 100%;
      -webkit-transition: all ease .5s;
      -moz-transition: all ease .5s;
      transition: all ease .5s;
      opacity: 0;
      background: rgba(254, 209, 54, 0.9); }
      #portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {
        opacity: 1; }
      #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
        font-size: 20px;
        position: absolute;
        top: 50%;
        width: 100%;
        height: 20px;
        margin-top: -12px;
        text-align: center;
        color: white; }
        #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
          margin-top: -12px; }
        #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
        #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
          margin: 0; }
  #portfolio .portfolio-item .portfolio-caption {
    max-width: 400px;
    margin: 0 auto;
    padding: 25px;
    text-align: center;
    background-color: white; }
    #portfolio .portfolio-item .portfolio-caption h4 {
      margin: 0;
      text-transform: none; }
    #portfolio .portfolio-item .portfolio-caption p {
      font-size: 16px;
      font-style: italic;
      margin: 0;
      font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif; }

#portfolio {
  background-image: url('app/img/chemex.jpg');
  background-size: cover;
  background-position: right center;
}
#portfolio * {
  z-index: 3; }

div.card {
    width: 250px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.39);
    text-align: center;
    visibility: hidden;    
}

div.card-deck {
  margin-bottom: 30px;
}

.fa-stack {
  visibility: hidden;
  color: #004DB9;
}

.card-img-top {
  border-top: 3px solid #606060;
  border-left: 3px solid #606060;
  border-right: 3px solid #ccc;
  border-bottom: 3px solid #ccc;
  margin: 4px;
  
}


a:link {
  text-decoration: none;
  color: #fff;
}



a:visited {
  text-decoration: none;
  color: #fff;
}

header a:hover {
  text-decoration: none;
  /*color: #ccc;*/
  text-shadow: 0 -1px 30px #004DB1;
}

div.card-footer {
  background: none;
}

div.card-footer a:link {
  text-decoration: none;
  color: #000;
}

div.card-footer a:visited {
  text-decoration: none;
  color: #000;
}

div.card-footer a:hover {
  text-decoration: none;
  color: #000;
  text-shadow: 0 1px 6px #ccc;
}

.metal {
  position: relative;
  margin: 40px auto;
  outline: none;
  
  color: hsla(0,0%,20%,1);
  text-shadow: hsla(0,0%,40%,.5) 0 -1px 0, hsla(0,0%,100%,.6) 0 2px 1px;
  
  background-color: hsl(0,0%,90%);
  box-shadow: inset hsla(0,0%,15%,  1) 0  0px 0px 4px, /* border */
    inset hsla(0,0%,15%, .8) 0 -1px 5px 4px, /* soft SD */
    inset hsla(0,0%,0%, .25) 0 -1px 0px 7px, /* bottom SD */
    inset hsla(0,0%,100%,.7) 0  2px 1px 7px, /* top HL */
    
    hsla(0,0%, 0%,.15) 0 -5px 6px 4px, /* outer SD */
    hsla(0,0%,100%,.5) 0  5px 6px 4px; /* outer HL */ 
  
  transition: color .2s;
}

.metal.linear {
  border-radius: .5em;
  background-image: -webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0)   6%, hsla(0,0%,100%, .1) 7.5%),
    -webkit-repeating-linear-gradient(left, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   4%, hsla(0,0%,  0%,.03) 4.5%),
    -webkit-repeating-linear-gradient(left, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,.15) 2.2%),
    
    linear-gradient(180deg, hsl(0,0%,78%)  0%, 
    hsl(0,0%,90%) 47%, 
    hsl(0,0%,78%) 53%,
    hsl(0,0%,70%)100%);
}

.badges {
  background: #e3e3e3; /* Old browsers */
  background: -moz-linear-gradient(top, #b2b2b2 0%, #fcfcfc 10%, #fcfcfc 90%, #b2b2b2 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #b2b2b2 0%,#fcfcfc 10%,#fcfcfc 90%,#b2b2b2 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #b2b2b2 0%,#fcfcfc 10%,#fcfcfc 90%,#b2b2b2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  min-height: 300px;
  padding-top: 30px;
}

.devicon::before{
  margin-top: 20px;
}
.devicon {
  font-size: 70px;
  color: #004DB9;
  margin: 20px;

}

form {
  margin-bottom: 0;
}