/* Colors */
/* General Colors */
/* Heading sizes */
/* Intro */
/* Header */
/* Slides/Slides Container */
/* Footer */
/* Footer Buttons */
/* Slide Numbers */
/* If you add/remove buttons, change this number */
/* Audio player width */
/* fill color of progress bar & more? */
/* rarely used */
#header {
  display: none; }

#slides-container {
  top: 0; }

.slide {
  padding: 0; }

h2 {
  padding: 2rem; }

.banner {
  min-height: 100vh;
  background: url(../images/sub-0.jpg) no-repeat;
  background-size: cover;
  position: relative;
  width: 100%; }
  .banner.half {
    min-height: 60vh; }
  .banner.stage-1 {
    background-image: url(../images/banners/stage-1.jpg); }
  .banner.stage-2 {
    background-image: url(../images/banners/stage-2.jpg); }
  .banner.stage-3 {
    background-image: url(../images/banners/stage-3.jpg); }
  .banner.stage-4 {
    background-image: url(../images/banners/stage-4.jpg); }
  .banner h1 {
    position: absolute;
    bottom: 30px;
    left: 30px;
    font-size: 2.5rem;
    padding: 1rem;
    background: #A67F31;
    color: #fefefe; }

.tile-cont {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 3rem 0; }
  .tile-cont .tile {
    min-width: 400px;
    min-height: 250px;
    background: url(../images/tiles/stage-1.jpg) no-repeat;
    padding: 0;
    position: relative;
    margin: 0.75rem; }
    .tile-cont .tile span {
      display: block;
      background: #2A647A;
      width: 100%;
      padding: 1rem;
      font-size: 1.2rem;
      font-weight: bold;
      color: #fefefe;
      position: absolute;
      bottom: 0;
      border-radius: 0 0 5px 5px; }
    .tile-cont .tile:hover span {
      text-decoration: underline; }
    .tile-cont .tile.stage-2 {
      background-image: url(../images/tiles/stage-2.jpg); }
      .tile-cont .tile.stage-2 span {
        background: #6E1942; }
    .tile-cont .tile.stage-3 {
      background-image: url(../images/tiles/stage-3.jpg); }
      .tile-cont .tile.stage-3 span {
        background: #514B77; }
    .tile-cont .tile.stage-4 {
      background-image: url(../images/tiles/stage-4.jpg); }
      .tile-cont .tile.stage-4 span {
        background: #427324; }

.stage {
  color: #FABC6F;
  background: #464950;
  padding: 3rem 15%; }
  .stage h2 {
    padding: 0 0 1rem;
    font-weight: bold; }
  .stage .box {
    margin: 2.5rem 0;
    border: solid 2px #FABC6F;
    border-radius: 5px;
    padding: 0.75rem; }
    .stage .box p {
      margin-bottom: 0.6rem; }

.questions {
  padding: 3rem 15%; }
  .questions h2 {
    font-weight: bold;
    font-size: 1.5rem;
    padding: 1rem 0; }

.scenario {
  padding: 3rem 15%;
  background: url(../images/banners/stage-1.jpg) no-repeat;
  /*background-size: cover;*/ }
  .scenario .box {
    color: #fefefe;
    background: purple;
    padding: 1.5rem;
    border-radius: 5px; }
    .scenario .box h2 {
      font-size: 1.6rem;
      font-weight: bold;
      padding: 0 0 1rem; }
  .scenario.stage-1 {
    background-image: url(../images/section-imgs/stage-1.jpg); }
    .scenario.stage-1 .box {
      background: #2A647A; }
  .scenario.stage-2 {
    background-image: url(../images/section-imgs/stage-2.jpg); }
    .scenario.stage-2 .box {
      background: #6E1942; }
  .scenario.stage-3 {
    background-image: url(../images/section-imgs/stage-3.jpg); }
    .scenario.stage-3 .box {
      background: #514B77; }
  .scenario.stage-4 {
    background-image: url(../images/section-imgs/stage-4.jpg); }
    .scenario.stage-4 .box {
      background: #427324; }

.btn-cont {
  margin: 1.5rem 0; }
  .btn-cont .return {
    background: #A62D1C;
    color: #fefefe;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    margin: 0 auto;
    display: block; }
    .btn-cont .return:hover {
      text-decoration: underline; }

button:focus {
  outline: dotted 1px #A62D1C;
  outline-offset: 3px; }