html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    background-color: black;
    color: black;
    overflow-x: hidden;
}

.example::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.logo img{
	width:47px;
}

  .background {
    background-image: linear-gradient(to bottom,transparent 40%,rgba(0,0,0,0.95) 70%, #020202), url("https://lumephotography.com/wp-content/uploads/2020/09/Copper-Harbor-Elopement-Mountain.jpg");
    width: 100vw;
    height: 100vh;
    background-position: top;
    z-index: 1;
    position: relative;
    box-shadow: 0 50px 50px black;
  }
  h1 {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%); 
    z-index: 100;
    text-transform: uppercase;
    letter-spacing: 0.5rem;
    font-size: 3rem;
    color: white;
    text-shadow: 2px 2px 5px;
  }
  .bb {
    position: absolute;
    top: 75%;
    left: 50%;
    transform: translate(-50%, -50%); 
    z-index: 100;
    max-width: calc(100%-60px);
  }
  .layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .layer-1 {
    background-image: linear-gradient(to bottom,transparent 50%,rgba(0, 0, 0,0.85) 70%, #020202), url("https://lumephotography.com/wp-content/uploads/2020/09/Copper-Harbor-Elopement-Mountain.jpg");
    z-index: 70;
  }
  .layer-2 {
    background-image: linear-gradient(to bottom,transparent 30%,rgba(0,0,0,0.9) 80%, #020202), url("https://lumephotography.com/wp-content/uploads/2020/09/Copper-Harbor-Elopement-Mountain.jpg");
    z-index: 80;
  }
  .layer-3 {
    background-image: 
      linear-gradient(to bottom,transparent 60%,rgba(0, 0,0,0.85), #020202), url("https://lumephotography.com/wp-content/uploads/2020/09/Copper-Harbor-Elopement-Mountain.jpg");
    z-index: 90;
  }
  .content {
    font-size: 1.2rem;
    line-height: 1.7;
    position: relative;
    background-size: cover;
    background-attachment: fixed;
    background-color:black;
  }
  .text {
    padding: 4rem 10rem 20rem 40rem;
  }


.navbar{
  background-color:rgba(0, 0, 0, 0.4);
	letter-spacing: 2px;
}
.nav-item{
	text-align: end;
}

form{
  background: black;
}
  @media only screen and (max-width: 1200px) {
    h1 {
      font-size: 2rem;
      letter-spacing: 0.1rem;
      text-align: center;
    }
    .rocks, .rock {
      display: none;
    }
    .text {
      padding: 0 3rem 5rem 3rem;
    }
  }

  label{
    color:white
  }
  
  @media only screen and (max-width: 600px) {
    .l,.r{
        margin-bottom: 10%;
        border-right: none !important;
    }   
  }