Main.css

body
{
  margin:0px;
  background-color:rgba(34,40,59,1);
}
#main{
  height:100vh;
  width:100%;
  position:absolute;
  overflow:hidden;
}
#backtext{
  font-family:Impact;
  font-size:15em;
  color:rgba(54,61,75,1);
  position: absolute;
  top:100px;
  left:100px;
  z-index:-1;
}
.box{
  position:absolute;
  top:50%;
  left:35%;
  transform: translate(-50%,-50%);
}
.title{
  font-family: Impact;
  font-size:8em;
  color:whitesmoke;
  position:absolute;
  margin-top:50px;
  margin-left:350px;
  line-height: 120px;
  letter-spacing: 5px;
}
.image{
  height: 450px;
  width:600px;
  box-shadow: 10px 10px 20px 10px rgba(0,0,0,.3);
}
.image img{
  height: 100%;
  width:100%;
}
.description{
  width:200px;
  font-family: arial;
  font-size:13px;
  color:whitesmoke;
  text-align:justify;
  line-height: 20px;
  position:absolute;
  margin-left:620px;
  margin-top:-120px;
}
.box2{
  left:100%;
}
.box3{
  left:165%;
}
.navigation{
  position:absolute;
  bottom:50px;
  left:50%;
  transform: translateX(-50%);
}
.navigation ul{
  list-style: none;
}
.navigation ul li{
  display:inline-block;
  height: 13px;
  width: 13px;
  background-color:whitesmoke;
  border-radius: 50%;
  margin:0px 5px 0px 5px;
}
.active{
  box-shadow: 0px 0px 0px 3px rgba(34,40,59,1), 0px 0px 0px 4px whitesmoke;
}