body {
 font-family: 'Pontano Sans', sans-serif;
 font-size: 17px;
 position: relative;
 background: url(../images/mochaGrunge.png);
}

header {
 position: relative;
 height: 100vh;
 width: 100%;
 background: #161415 url(../images/header_bg.jpg) no-repeat top center;
 background-position: 40% 60%;
 background-size: cover !important;
 -webkit-background-size: cover !important;
 box-shadow: inset 0 0 1em #111;
 text-align: center;
 overflow: hidden;
}

header h1, section h1 {
 font-family: 'PT Sans', sans-serif;
 font-weight: bold;
 color: #2E0854;
}

header .header_top {
 position: relative;
 height: 100vh;
}

header .header-block {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  color: white;
  background-color: rgba(20,20,20,.75);
}

header .header-text {
  font-family: 'PT Sans', sans-serif;
  font-weight: bold;
  font-size: 3vmax;

  padding-left: 20px;
  padding-right: 20px;
}

header .header-info {
  font-family: 'PT Sans', sans-serif;
  font-size: 1vmax;
}

header .header-info  a{
  color: #A0A0A0;
}

header .scrolldown {
 position: absolute;
 bottom: 0;
 left: 50%;
 margin-bottom: 20px;
}

header .scrolldown .glyphicon {
 font-size: 4vh;
 color: black;
}

header .scrolldown .glyphicon:hover {
  transition: .5s;
  color: #2E0854;
}

#nav.affix {
  position: fixed;
  top: 0;
  width: 100%;
  z-index:10;
  padding: 0;
}

.navbar .navbar-nav {
  display: inline-block;
  float: none;
  background-color: #2E0854;
}

.navbar .navbar-collapse {
  border: none;
  text-align: center;
  overflow-y: visible;
  box-shadow: none;
  -webkit-box-shadow: none;
}

.navbar-collapse.in {
  margin-top: -40px;
}

.collapsing {
  margin-top: -40px;
}

.navbar-toggle {
  color: #A0A0A0;
  border: none;
  padding: 0;
  float: none;
  top: -6px;
}

.navbar-toggle:hover {
  color: #F8F991 !important;
  text-decoration: none;
  background-color: transparent !important;
}

.custom-nav {
  text-align: center;
  background: #2E0854;
  border: none;
  height: 30px !important;
}

.nav {
 font-family: 'PT Sans', sans-serif;
 font-weight: bold;
 outline: none;
}

.nav .active .smoothscroll {
  color : #F8F991 !important;
}

.nav-item {
  color: #A0A0A0 !important;
  background-color: transparent !important;
}

.nav-item:hover {
  color: #F8F991 !important;
}

section .about {
  min-height: 50vh;
  color: white;
  box-shadow: inset 0 0 1em #111;
}

section .skills {
  min-height: 100vh;
  color: white;
  box-shadow: inset 0 0 1em #111;
}

section .contact {
  min-height: 100vh;
  background-position: 40% 37%;
  color: white;
  background-attachment: fixed;
  background-size: cover;
  box-shadow: inset 0 0 1em #111;
  background-image: url(../images/mailbox_small_shaded.jpg);
}

.section-header {
  color: #2E0854;
  text-align: center;
  font-weight: bolder !important;
  font-size: 32px !important;

  padding-top: 10px;
}

.section-content {
  padding-left: 5px;
  font-size: 20px;
  color: white;
  text-align: justify;
}

.parallax {
  height: 50vh;
  background-attachment: fixed;
  background-position: bottom center;
  background-size: cover;
  box-shadow: inset 0 0 1em #111;
  background-image: url(../images/road_small.jpg);
}

.quote-container {
  display: table;
  height: inherit;
  width: 100%;
  overflow: hidden;
}

.quote-text {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-family: 'PT Sans', sans-serif;
  font-size: 2.5vw;
  color: #F8F991;
}

.skill-card-row {
  padding-top: 25px;
}

.skill-card {
  text-align: center;
  max-width: 400px;
  margin: 0 auto !important;

  padding-top: 20px;
  padding-bottom: 20px;
}

.skill-card img {
  max-width: 150px;
  max-height: 150px;
}

.skill-card-title {
  padding-top: 15px;
  padding-bottom: 15px;
  font-weight: bolder;
  margin: 0 auto !important;
  max-width: 400px;
}

.skill-card-text {
  max-width: 400px;
  position: relative;
  margin: 0 auto !important;
  left: 0%;
}

.skill-card-spacer {
  max-width: 10px;
  max-height: 10px;
}

.contact-container {

}

.contact-header {
  color: #F8F991;
}

.contact-content {
  text-align: center;
}

.contact label {
  width: 30%;
  vertical-align: top;
  text-align: center;
}

.contact input, .contact textarea {
  width: 55%;
  color: black;
  box-sizing:border-box;
  -moz-box-sizing:border-box;
}

.form-row {
  padding-top: 10px;
  padding-bottom: 10px;
}

.form-submit {
  margin-left: calc(30% + 4px);
}

.form-submit .submit {
  border: none;
  padding: 10px 15px 10px 15px;
  background-color: #2E0854;
  color: #F8F991;
  border-radius: 8px !important;
}

.form-submit .submit:hover {
  background-color: #A0A0A0;
}

.form-status {
  text-align: center;
}

footer {
  box-shadow: inset 0 0 1em #111;
}

footer .footer-text {
  color: white;
  padding-top: 25px;
    padding-bottom: 25px;
  text-align: center;
}

footer a {
  color: #2E0854;
  padding-bottom: 5px;
}

footer a:hover {
  color : #F8F991;
  text-decoration: none;
}