* {
  box-sizing: border-box;
}

body{
  background-color: black;
}

h1, h2, p, label, button{
  color: white;
}

.container {
  display: grid;
  grid-template-columns: repeat(12, [col-start] 1fr);
  gap: 20px;
}

/* Mobile first */
.container > * {
  padding: 10px;
  grid-column: col-start / span 12;
}

@media (max-width: 767px) {
  .content{
    grid-column: col-start / span 12;
  }

  #contract{
    position: absolute;
    top: 10%;
  }

  h1{
    font-family: 'Impact', sans-serif;
    font-weight: 800;
    font-size:2.5rem;
    padding-top: 15%;
  }

  .head{
    background-image: url('images/planet.png');
    background-size: cover;
    height: 50vh;
  }

}

@media (min-width: 768px) {
  .content {
    grid-column: col-start / span 12;
    grid-row: 2 / 4;
  }
  .footer, .proof {
    grid-column: col-start / span 12;
  }

  #contact-section{
    display: flex;
    align-items: flex-start;
  }

  #contact-us{
    width:50%;
  }

  #fillable{
    width: 50%;
    margin-top: 6.5%;
    margin-left: 3%;
  }

  #about{
    width: 50%;
    margin-left: 3%;
  }

  #statement{
    width: 50%;
  }

  #about-section{
    display: flex;
  }

  h1{
    padding-top: 20%;
    font-family: 'Impact', sans-serif;
    font-weight: 800;
    font-size:5rem;
    transform: scaleY(1.5);
  }

  .head{
    background-image: url('images/planet.png');
    background-size: cover;
    height: 100vh;
  }
  #us, #ready{
    margin-left: 6%;
  }

  .reach, .info{
    margin-left: 3%;
  }

}

#planet{
    height: auto;
    max-width: 100%;
}

.head, .footer, .proof{
    position: relative;
}

a{
    text-decoration:none;
    color:white;
    margin-left: 5%;
    padding-bottom: 5%;
}

a:hover{
  color:red;
}

h2{
  font-family: 'Impact', sans-serif;
  font-weight: 500;
  font-size:xx-large;
}

p{
  font-family: 'Montserrat', sans-serif;
  font-weight: 100;
  font-size:large;
  line-height: 1.8;
}

input{
  margin-bottom:5%;
  width: 75%;
  padding:1%;
}

button{
  background-color:rgb(42, 45, 46);
  color: white;
  padding: 1% 5% 1% 5%;
}

button:hover{
  background-color:black;
}

.field{
  font-family: Georgia, 'Times New Roman', Times, serif;
}

li{
  list-style-type: none;
  padding-right: 10%;
}

nav{
  position: relative;
  z-index:10;
}