body {
  overflow-x: hidden;
}

/***** Navbar *****/
.nav-item a {
  text-decoration: underline;
}

/***** Body Elements *****/
a, a:hover, a:focus {
	color: #27b517;
	text-decoration: none;
	-o-transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-ms-transition: all .5s;
	transition: all .5s;
}

.styled-button {
  background: rgba(17, 17, 17);
  color: #fff;
  border-radius: 2px;
  border: 1px solid transparent;
  
  letter-spacing: 2px;
  font-size: 15px;
  padding: 8px 37px;
  transition: all 0.125s ease-in-out 0s;
  box-shadow: none;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  touch-action: manipulation;
}


/***** Banner *****/
#banner { 
  position: relative;
  display:flex;
  align-items: center;
  justify-content:center;
  overflow: hidden;
  background-size: cover;
  height: 400px; 
  background-image: url(../img/top-content.jpg);
}

#banner h1 { 
  text-align: center;
  letter-spacing: 5px;
	font-weight: 700;
	font-size: 80px;
	color: #fff;
}

/***** Buttons *****/
#buttons {
  background: #343a40;
}


/***** Main content *****/
#mid-section {
  background: url(../img/graphic-v2.png);
  position: relative;
  height: 50vw;
  background-size: cover; 
}

.buttons {
  text-align: center;
}

.buttons .btn {
  width: 200px;
}

.options-title {
  display: inline;
}

/***** Bottom Text *****/
#bottom-text {
  background: #343a40;
}

/***** Instructions *****/
#instructions {
  background: url("../img/top-content.jpg") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 100%;
}

#instructions h1 {
  text-align: center;
}

#instructions .card {
  background-color: rgba(245, 245, 245, 0.9);
}

#instructions .card-body {
  opacity: 1;
}