.home-page {
@include container(100%);
height: 100%;
min-height: 1020px;
nav {
    ul {
        @include horizontal-list();
        li {
            @include box-sizing(border-box);
            width: 20%;
            padding: 2%;
            text-align: center;
        }
    }
}
.about-me {
    width: inherit;
    height: auto;
    .about-text {
        @include span(5);
    }
    .about-pic {
        @include span(3 at 9 of 12);
    }
  }
}

<div class="home-page">

<nav>
    <ul>
        <li class="navi home-nav"><a href="#">HOME</a></li>
        <li class="navi work-nav"><a href="#">WORK</a></li>
        <li class="navi logo-nav"><a href="#">Placeholder</a></li>
        <li class="navi blog-nav"><a href="#">BLOG</a></li>
        <li class="navi cont-nav"><a href="#">CONTACT</a></li>
    </ul>
</nav>

<div class="about-me">
    <div class="about-text">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores, iure quasi veritatis? Natus pariatur molestias modi laborum sed numquam, architecto nemo. Nobis id itaque nostrum, aliquam repellendus qui voluptatem? Soluta.
    </div>
    <div class="about-pic">Pic goes here</div>
</div>