/*!
 * Start Bootstrap - Scrolling Nav (https://startbootstrap.com/templates/scrolling-nav)
 * Copyright 2013-2020 Start Bootstrap
 * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-scrolling-nav/blob/master/LICENSE)
 */
header {
  padding: 156px 0 100px;
}

section {
  padding: 150px 0;
}


body{
font-family: 'Permanent Marker', sans-serif;
}

h1{
    font-size: 8.5rem;
    font-weight: bold;
}

a{
color: red
}

.subtitle > a {
color:black
}

a:hover{
color: black
}

.nav-item > a{
color:black!important;
}

.subtitle{
display: flex;
justify-content: center;
}

.bg-primary{
background-color: transparent!important;
}

#slapstick{
background-image: url('../images/slapstick.jpg');
background-size: contain;
background-repeat: no-repeat;
width: auto;
height: 500px;
margin-bottom: 0;
}

#ride{
background-image: url('../images/ride.jpg');
background-size: contain;
background-repeat: no-repeat;
width: auto;
height: 500px;
}

#pz{
background-image: url('../images/pz.jpg');
background-size: contain;
background-repeat: no-repeat;
width: auto;
height: 500px;
}

.bg-pz{
background-image: url('../images/pz.gif');
background-size: cover;
}

@media all and (max-device-width: 499px) {

  #mainNav{
  display: none!important;
  }

  h1{
  font-size: 3.5rem;
  }

  .subtitle{
  font-size: 1rem;
  flex-flow: column;
  }

  #slapstick, #pz, #ride{
  height:250px;
  }

  .bg-pz{
  height: 100%;
  }

  section{
    padding: 50px 0
  }


}