// ------- Smaller screen styling
@media (max-device-width: 800px) {
  .header #logo {
    position: static;
    margin-top: -1em;
    margin-bottom: -2em;
  }

  .navi {
    padding-bottom: 1em;

    position: absolute;
    width: 100%;
    top: initial;
    right: 0;
    transition: background-color 0.2s ease;

    &.scroll {
      top: 0;
      position: fixed;
      background-color: rgba(61, 61, 61, 0.8);
    }

    ul { position: relative; }

    li {
      float: left;
      width: 25%;
    }

    .text {
      visibility: visible;
      font-size: 1.2em;
    }
  }

  .page-section > .text-content:first-of-type { margin-top: 5rem; }
  .page-section.social .text { visibility: visible; }
}

@media (max-device-width: 435px) {
  .page-section > .text-content { width: 85%; }
}

@media (max-device-width: 372px) {
  form .input-before.textarea {
    position: relative;
    top: 1px;
    border: none;
  }
}

@media (max-device-width: 338px) {
  form .group { margin-right: 0; }
}

// ------- Smaller screen styling
@media (max-device-width: 800px) {
  .header #logo {
    position: static;
    margin-top: -1em;
    margin-bottom: -2em;
  }

  .navi {
    padding-bottom: 1em;

    position: absolute;
    width: 100%;
    top: initial;
    right: 0;
    transition: background-color 0.2s ease;

    &.scroll {
      top: 0;
      position: fixed;
      background-color: rgba(61, 61, 61, 0.8);
    }

    ul { position: relative; }

    li {
      float: left;
      width: 33%;
    }

    .text {
      visibility: visible;
      font-size: 1.2em;
    }
  }

  .page-section > .text-content:first-of-type { margin-top: 5rem; }
  .page-section.social .text { visibility: visible; }
}

@media (max-device-width: 435px) {
  .page-section > .text-content { width: 85%; }
}

@media (max-device-width: 372px) {
  form .input-before.textarea {
    position: relative;
    top: 1px;
    border: none;
  }
}

@media (max-device-width: 338px) {
  form .group { margin-right: 0; }
}

Fix small screen navbar stretching
Fix small screen navbar stretching