html,
body {
  /* Before Halo */
  /*background-color: #eee;*/
  background-color: #161622;
}

body,
h1,
p {
  font-family: "Helvetica Neue", "Segoe UI", Segoe, Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: normal;
  margin: 0;
  padding: 0;
  text-align: center;
}

/* For the halo background */

#background {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1;
}

.container {
  margin-left: auto;
  margin-right: auto;
  margin-top: 10%;
  max-width: 1170px;
  padding-right: 15px;
  padding-left: 15px;
  /* For the halo background */
  position: relative;
  z-index: 2;
  color: #fff;
  /* Done */
}

.row:before,
.row:after {
  display: table;
  content: " ";
}

/* For a right footer */
footer {
  position: absolute;
  z-index: 1;
  bottom:0;
  right:0;

  text-align: right;
  padding-right: 15px;
  padding-bottom: 15px;
} 

@media (max-width: 800px) {
  footer {
    position: relative;
    z-index: 1;
    bottom:0px;
  
    text-align: center;
  }
}

.vertical-line {
  width: 1px; /* Line width */
  background-color: #fff; /* Line color */
  display: inline-block;
  height: 48px;
  margin-right: 10px;
  margin-left: 10px;
}

h1 {
  font-size: 48px;
  font-weight: 300;
  margin: 0 0 20px 0;
}

.lead {
  font-size: 21px;
  font-weight: 200;
  margin-bottom: 20px;
}

p {
  margin: 0 0 10px;
  font-weight: 200;
}

a {
  color: #3282e6;
  text-decoration: none;
}