    html body {
        font-family: 'Barlow Condensed', sans-serif;
        font-size: 24px;
        overflow-y: scroll; 
        overflow-x:hidden;
        position: relative;
        padding-top: 140px;
    }

   :root {
    --yellow: #ffce00;
    --red: #cf102d;
    --gray: #868e96;
    --gray-dark: #343a40;
    --light: #e5e5e5;
    --dark: #343a40;
           }

.w100 {
  font-weight: 100;
}

.w200 {
  font-weight: 200;
}

.w300 {
  font-weight: 300;
}

.w400 {
  font-weight: 400;
}

.w500 {
  font-weight: 500;
}

.w600 {
  font-weight: 600;
}

.w700 {
  font-weight: 700;
}

.w800 {
  font-weight: 800;
}

.w900 {
  font-weight: 900;
}
    
         .pghead {
        text-align: center;
         font-family: 'Barlow Condensed', sans-serif;
        color: var(--red);
        font-weight: 900;
        font-size: 48px;
    	padding-top: 0px;
    }

        .detailshead {
         font-family: 'Barlow Condensed', sans-serif;
        color: var(--red);
        font-weight: 900;
        font-size: 30px;
    }

          .nav-item {
              font-size: 18px;
          }
          
          .nav-text {
            color: var(--yellow);
             font-family: 'Barlow Condensed', sans-serif;
              text-shadow: 6px 4px 12px rgba(0,0,0,0.8);
              font-size: 28px;
              font-weight: 700;
              text-align: right;

          }

          .headline {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
              color: white;
             font-family: 'Barlow Condensed', sans-serif;
              text-shadow: 6px 4px 12px rgba(0,0,0,0.8);
              text-align: center;
              font-size: 90px;
              line-height: 85%;
          }

          .headline-small {
              color: white;
             font-family: 'Barlow Condensed', sans-serif;
              text-shadow: 6px 4px 12px rgba(0,0,0,0.8);
              text-align: center;
              font-size: 48px;
              line-height: 80%;
          }

              .parallax1 { 
  /* The image used */
  background-image: url("../images/FHL2.jpg");

  /* Set a specific height */
  height: 100vh;
  margin-bottom: 0px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

          .parallax2 { 
  /* The image used */
  background-image: url("../images/FHL3.jpg");

  /* Set a specific height */
  height: 100vh;
  margin-bottom: 0px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

          .parallax3 { 
  /* The image used */
  background-image: url("images/BPC3.jpg");

  /* Set a specific height */
  height: 120vh;
  margin-bottom: 0px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
    position: relative;
}

        .parallax4 { 
  /* The image used */
  background-image: url("images/BPC4.jpg");

  /* Set a specific height */
  height: 130vh;
  margin-bottom: 0px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
    position: relative;
}

          .parallax5 { 
  /* The image used */
  background-image: url("../images/Cathy1.jpg");

  /* Set a specific height */
  height: 100vh;
  margin-bottom: 0px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
    position: relative;
}

          .parallax6 { 
  /* The image used */
  background-image: url("../images/Missy2.jpg");

  /* Set a specific height */
  height: 100vh;
  margin-bottom: 0px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
    position: relative;
}

 .left-text {
  position: absolute;
  top: 50%;
  left: 25%;
  transform: translate(-50%, -50%);
  padding: 5%;
  width: 35%;
  background:rgba(255,255,255,0.8);
  border: 1px #e5e5e5 solid;
  box-shadow: 3px 3px 5px rgba(0,0,0,0.4);
  
}
      
.centered-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 5%;
  width: 70%;
  background:rgba(255,255,255,0.8);
  border: 1px #e5e5e5 solid;
  box-shadow: 3px 3px 5px rgba(0,0,0,0.4);
}

.details-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 3%;
  width: 80%;
  background:rgba(255,255,255,0.8);
  border: 1px #e5e5e5 solid;
  box-shadow: 3px 3px 5px rgba(0,0,0,0.4);
}

.title-text {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 5%;
  width: 70%;
}

.right-text {
  position: absolute;
  top: 50%;
    left: 75%;
  transform: translate(-50%, -50%);
  padding: 5%;
  width: 35%;
  background:rgba(255,255,255,0.8);
  border: 1px #e5e5e5 solid;
  box-shadow: 3px 3px 5px rgba(0,0,0,0.4);
  
}
      
.table {
  border-bottom: 1px solid #dddddd;
}

.card-header {
    background-color: white;
    border-bottom: solid 1px #cf102d;
    text-align: left;
}

*[id]:before { 
  display: block; 
  content: " "; 
  margin-top: -143px; 
  height: 143px; 
  visibility: hidden; 
}

.section-text {
    color: var(--yellow);
    background-color: var(--red);
    font-weight: 700;
    font-size: 36px;
    text-transform: uppercase;
    text-shadow: 3px 3px 9px rgba(0,0,0,0.8);

}
