style.css

* {
  margin: 0px;
}

html body {
  font-family: 'Gloria Hallelujah', cursive;
  height: 100%;
  width: 100%;
  margin: 0px;
}

/* Global layout */

.fullscreen-section {
  position: relative;
  border: none;
  margin: 0 auto;
  width: 100%;
  height: 100vh;
  font-size: 0;
}

.fullscreen-left {
  position: absolute;
  display: inline-block;
  width: 50%;
  height: 100%;
}

.left-title-content {
  font-size: 2rem;
  text-align: center;
  margin: 0;
  width: 100%;
  height: 100%;
  top: 50%;
  position: absolute;
}

.fullscreen-right {
  font-size: 2rem;
  margin: auto;
  text-align: center;
  right: 0;
  position: absolute;
  display: inline-block;
  width: 50%;
  height: 100%;
  background-color: white;
}

/* Top section */

.top {
  height: 100vh;
  background-color: black;
  width: 100%;
  position: relative;
}

.top-center {
  color: white;
  width: 600px;
  height: 400px;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
}

.logo {
  margin-top: 1em;
  font-size: 2.5em;
  text-align: center;
}

.watermelon {
  display: block;
  margin: 1em auto;
  width: 7em;
  height: 7em;
}

h3 .top-content {
  text-align: center;
  padding-left: 20px;
  overflow: hidden;
}

.nav-container {
  width: 100%;
  position: absolute;
  bottom: 7%;
  z-index: 3;
}

/* About section */

.about-title {
  background-color: #F35050;
}

.about-content {
  top: 10%;
}

.about-para {
  text-align: center;
  bottom: 25%;
  position: absolute;
}

.nav-container-about {
  width: 100%;
  position: absolute;
  bottom: 60%;
  z-index:999;
}

.nav-container-about ul{
  position: absolute;
  left: 15%;
  right: 15%;
}

.nav-container-about li a {
  font-size: 0.8em;
}

/* Team section */

.team-member {
  text-align: center;
}

.img-team {
  width: 200px;
  height: 200px;
  border-radius: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  margin: 40px auto;
}

.team-scroll {
  height: 100vh;
  overflow-y: scroll;
  display: block;
}

/* Style all font awesome icons */
.fa {
  padding: 20px;
  font-size: 30px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
}

/* Add a hover effect if you want */
.fa:hover {
  opacity: 0.7;
}

/* Linkedin */
.fa-linkedin {
  background: white;
  color: #3B5998;
}

/* Github */
.fa-github {
  background: white;
  color: black;
}

/* Form section */

.button {
  padding: 15px 25px;
  font-size: 1rem;
  color: black;
  background-color: #F35050;
  border-radius: 15px;
  border: 2px;
}

.nav-container-form {
  width: 100%;
  position: absolute;
  bottom: -300%;
  z-index:999;
}

.nav-container-form li a {
  font-size: 0.8em;
}

label {
  display: inline-block;
  width: 90px;
  text-align: right;
}

input, textarea {
  font: 1em sans-serif;
  width: 300px;
  box-sizing: border-box;
  border: 1px solid #999;
}

input:focus, textarea:focus {
  border-color: #000;
}

textarea {
  vertical-align: top;
  height: 5em;
}

button {
  margin-left: .5em;
}

form {
  margin: 0 auto;
  width: 400px;
  padding: 1em;
}

form div+div {
  margin-top: 1em;
  margin-bottom: 1em;
}

ul {
  width: 500px;
  margin: 0 auto;
  list-style: none;
}

li {
  float: left;
}

li a {
  font-size: 1.5em;
  padding-left: 40px;
  text-decoration: none;
  text-align: center;
  color: white;
}

.form-title-content {
  font-size: 2rem;
  text-align: center;
  margin: 0;
  width: 100%;
  top: 50%;
  position: absolute;
}

.form-title {
  position: absolute;
  display: inline-block;
  width: 50%;
  height: 100%;
  background-color: #F35050;
}

.form-content {
  font-size: 2rem;
  margin: auto;
  text-align: center;
  right: 0;
  position: absolute;
  display: inline-block;
  width: 50%;

  background-color: white;
  top: 10%;
}

.team-title {
  position: absolute;
  display: inline-block;
  width: 50%;
  height: 100%;
  background-color: black;
  color: white;
}

.contact-wrapper {
  text-align: center;
}

#gform {
  width: 90%;
  display: inline-block;
}

#name {
  width: 50%;
}

#email {
  width: 80%;
}

#message {
  width: 50%;
}

.name-label {
  font-size: 1rem;
}

.message-label {
  font-size: 1rem;
}

.email-label {
  font-size: 1rem;
}

.h2-div {
  font-size: 1rem;
}

#thankyou_message {
  margin-bottom: 30px;
}

.button-xlarge {
  margin-bottom: 30px;
  width: 30%;
}