body {
  line-height: 1.2;
}

.logo-box .logo {
  padding: 2em 1em;
}

.showcase-frame {
  height: 89%;
  display: grid;
  grid-template-areas: 1fr;
  font-family: "Archivo", sans-serif;
}

.main-container {
  background-color: #f9f6f1;
}

p {
  color: #77736f;
  font-size: 1.1em;
}

.para-container {
  margin-bottom: 1em;
}

.checkmarks-container {
  margin-bottom: 1.5em;
}

.checkmarks-container img {
  margin-right: 0.4em;
}

.checkmarks-container p {
  margin-bottom: 0.4em;
}

.box-1 {
  background-image: url("Assets/Camp\ Images/High\ Quality\ Images/Latik\ Riverside.jpg");
  background-position: center;
  background-size: cover;
  height: 20em;
  background-repeat: no-repeat no-repeat;
}

.box-2 {
  padding: 2em 0;
}

.box-2 .header {
  width: 90%;
  margin: 0 auto;
}

.header h1 {
  font-size: 2em;
  margin-bottom: 0.4em;
}

.partners-container p {
  margin-bottom: 0.4em;
}

@media (min-width: 699px) {
  .main-container {
    height: 100vh;
  }
  .header h1 {
    font-size: 3em;
  }

  .box-1 {
    height: 28em;
  }
}

@media (min-width: 1199px) {
  .box-1 {
    grid-area: box-1;
  }

  .box-2 {
    grid-area: box-2;
  }
  .showcase-frame {
    height: 100%;
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: "box-2 box-1";
    position: relative;
  }
  .box-1 {
    height: 100%;
  }

  .box-2 {
    place-self: center;
  }

  .logo-box .logo {
    padding: 0;
    position: absolute;
    top: 4%;
    left: 8%;
    z-index: 100;
  }

  .box-2 .header {
    width: 70%;
  }

  .header h1 {
    margin-bottom: 0.2em;
  }

  p {
    font-size: 1.1em;
  }
}
