body, html {
  margin: 0;
  height: 100%;
}

body {
  background:#E8E8E8;
  padding-top: 50px;
  font-family: 'open sans';
  position: relative;
}

.wrapper {
	height: 100% !important;
	height: 100%;
	margin: 0 auto; 
  overflow-y: scroll;
  overflow-x: hidden;

}

h1, h2 {
  width: 100%;
  float: left;
}
h1 {
  margin-top: 10px;
  color: #000;
  margin-bottom: 10px;
  font-size: 70px;
  letter-spacing: 2px;
  font-weight: 100;
  text-align: left;
}

h2 {
  font-weight: 100;
  margin-top: 0;
  margin-bottom: 10px;
  letter-spacing: 1px;
}

.reload, .btn{
  display: inline-block;
  border: 4px solid #A2261E;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  background: #A4C639;
  display: inline-block;
  line-height: 100%;
  padding: 0.7em;
  text-decoration: none;
  color: #fff;
  width: 100px;
  line-height: 140%;
  font-size: 17px;
  font-family: open sans;
  font-weight: bold;
}
.reload:hover{
  background: #A4C639;;
}
.btn {
  width: 200px;
  color: rgb(0,0,0);
  border: 4px solid rgb(0, 0, 0);
  background: #A4C639;
}
.btn:hover, .btn:hover {
  background: rgba(164, 198, 57, 0.6);
  color: rgb(0,0,0);
}

#forkongithub a {
  margin-top: 25px;
  background:#6d6d6d;
  color:#fff;
  text-decoration:none;
  font-family:arial, sans-serif;
  text-align:center;
  font-weight:bold;
  padding:5px 40px;
  font-size:1rem;
  line-height:2rem;
  position:relative;
  transition:0.5s;
}
#forkongithub a:hover {
  background:#6d6d6d;
  color:#fff;
}

#forkongithub a::before, #forkongithub a::after {
  content:"";
  width:100%;
  display:block;
  position:absolute;
  top:1px;
  left:0;
  height:1px;
  background:#fff;
}

#forkongithub a::after {
  bottom:1px;
  top:auto;
}
@media screen and (min-width:800px) {
  #forkongithub {
    position:absolute;
    display:block;
    top:0;
    right:0;
    width:200px;
    overflow:hidden;
    height:200px;
  }
  #forkongithub a {
    width:200px;
    position:absolute;
    top:60px;
    right:-60px;
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    box-shadow:4px 4px 10px rgba(0,0,0,0.8);
  }
}

.container div .page_container {
  position: relative;
  top: 100%;
  margin: 0 auto 0;
  z-index: 3;
}

.container div.page1 {
  background: #969696;
}
.container div.page1 .page_container {
  min-height:400px;
  height:auto !important;
  height:400px; 
}
.container div.page1 .page_container #headers {
  width: 550px;
  float:right;
  padding-top: 80px;
}

.container div.page1 h2 {
  color:black;
  padding-left: 2px;
  text-align: left;
  width: 500px;
}
.container div .page_container .btns {
  margin-top: 10px;
  float: left;
  text-align: center;
  width: 550px;
}
.container div .page_container .btns a{
  text-align: center;
}
.container div.page2 {
  background: #606060;
  background: #606060 url(../images/arrow.png) no-repeat 800px -10px ;
}
.container div.page2 .page_container {
  min-height:500px;
  height:auto !important;
  height:500px; 
}
.container div.page2 .page_container #headers {
  width: 600px;
  padding-top: 80px;
  padding-left: 50px;
}
.container div.page2 > img {
  position: absolute;
  top: -300px;
  left: 50%;
  margin-left: -1095px;
}
.container div.page2 h1 {
  padding: 0;
  margin-bottom: 15px;
  font-size: 50px;
  letter-spacing: -1px;
  color: #A4C639;
}
.container div.page2 h2 {
  color: white;
  padding-left: 2px;
  text-align: left;
  width: 700px;
  font-size: 30px;
}

.container div.page3 {
  background: #2e2e2e url(../images/code.png) no-repeat 50px 250px ;
}
.container div.page3 .page_container #headers {
  width: 600px;
  padding-top: 80px;
  float:right;
  padding-left: 250px;
}
.container div.page3 > img {
  position: absolute;
  top: -300px;
  left: 50%;
  margin-left: -1095px;
}
.container div.page3 .page_container {
  min-height:800px;
  height:auto !important;
  height:700px; 
}
.container div.page3 h1 {
  padding: 0;
  margin-bottom: 15px;
  font-size: 50px;
  letter-spacing: -1px;
  color: #A4C639;
}
.container div.page3 h2 {
  color: #C0C0C0;
  padding-left: 2px;
  text-align: left;
  width: 700px;
  font-size: 30px;
}

.container div.page3 ul {
  list-style-type: none;
  text-align: right;
}

.container div.page3 ul h2{
  list-style-type: none;
  text-align: right;
  width: 700px;
  font-size: 20px;
}
.container div.page3 .page_container #docsList {
  margin-top: 30px;
  float: right;
  margin-right: 100px;
  width: 700px;
}
.container div.page3 .page_container #help {
  margin-top: 80px;
  float: right;
  margin-right: 0px;
  width: 700px;
}

.container div.page3 .page_container #help a:link,
.container div.page3 .page_container #help a:active, 
.container div.page3 .page_container #help a:visited {
  color: #A4C639; text-decoration: none;
}
.container div.page3 .page_container #help a:hover {
  color: #0066FF; text-decoration: none;
}

.container div.page3 li {
  list-style-type: none;
}

.container div.page2 a:link, div.page3 a:link {color: #A4C639; text-decoration: none; }
.container div.page2 a:active, div.page3 a:active {color: #A4C639; text-decoration: none; }
.container div.page2 a:visited, div.page3 a:visited {color: #A4C639; text-decoration: none; }
.container div.page2 a:hover, div.page3 a:hover {color: #0000ff; text-decoration: none; }

.container div.page3 a:link {color: white; text-decoration: none; }
.container div.page3 a:active {color: white; text-decoration: none; }
.container div.page3 a:visited {color: white; text-decoration: none; }
.container div.page3 a:hover {color: #0066FF; text-decoration: none; }

.container div.page4 {
  background: #585858;
}
.container div.page4 .page_container {
  min-height:1000px;
  height:auto !important;
  height:1000px; 
}
.container div.page4 .page_container #headers {
  width: 100%;
  padding-top: 80px;
  padding-left: 50px;
}
.container div.page4 h1 {
  padding: 0;
  margin-bottom: 15px;
  font-size: 50px;
  letter-spacing: -1px;
  color:#A4C639;
}
.container div.page4 h2 {
  color:white;
  font-size: 30px;
}

.container div.page4 p {
  color:black;
}

.container div.page4 .page_container #headers .container {
  margin-right: 50px;
}

.container div.page4 .page_container #headers .container img{
  margin-top: 40px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.container div.page4 .page_container #headers .container .col-lg-4 #personInfo{
  text-align: center;
  margin-top: 10px;
}

.container div.page4 .page_container #contInfo {
  width: 410px;
  margin: 0 auto;
  text-align: left;
  padding-top: 40px;
}

.container div.page4 .page_container #contInfo ul {
  color: white;
  text-align: left;
}

.container div.page4 .page_container #contInfo p {
  color:#A4C639;
  font-weight:light;
}
.container div.page4 a:link, div.page3 a:link {color: #A4C639; text-decoration: none; }
.container div.page4 a:active, div.page3 a:active {color: #A4C639; text-decoration: none; }
.container div.page4 a:visited, div.page3 a:visited {color: #A4C639; text-decoration: none; }
.container div.page4 a:hover, div.page3 a:hover {color: #0000ff; text-decoration: none; }

.container div.page5 {
  background: #2e2e2e;
}
.container div.page5 .page_container #headers {
  width: 800px;
  margin: 0 auto;
  padding-top: 80px;
}

.container div.page5 .page_container {
  min-height:350px;
  height:auto !important;
  height:350px; 
}
.container div.page5 h1 {
  padding: 0;
  text-align: center;
  margin-bottom: 25px;
  font-size: 50px;
  letter-spacing: -1px;
  color: #A4C639;
}
.container div.page5 h2 {
  color: white;
  text-align: center;
  font-size: 30px;
}

.container div.page5 a:link {color: #A4C639; text-decoration: none; }
.container div.page5 a:active {color: #A4C639; text-decoration: none; }
.container div.page5 a:visited {color: #A4C639; text-decoration: none; }
.container div.page5 a:hover {color: #0066FF; text-decoration: none; }

.container div.page6 {
  background: #2e2e2e;
}
.container div.page6 .page_container {
  min-height:100px;
  height:auto !important;
  height:100px; 
}
.container div.page6 .page_container #headers {
  border-top: 1px solid white;
  width: 70%;  margin: 0 auto;
  padding-top: 25px;
  text-align: center;
}

.container div.page6 h2 {
  color:white;
  font-size: 17px;
}

.container div.page6 a:link {color: #A4C639; text-decoration: none; }
.container div.page6 a:active {color: #A4C639; text-decoration: none; }
.container div.page6 a:visited {color: #A4C639; text-decoration: none; }
.container div.page6 a:hover {color: #0066FF; text-decoration: none; }