.hide-xlarge-up {
  display: block; }
  @media screen and (min-width: 75em) {
    .hide-xlarge-up {
      display: none; } }
.hide-xlarge-down {
  display: none; }
  @media screen and (min-width: 75em) {
    .hide-xlarge-down {
      display: block; } }
@font-face {
  font-family: 'avenir_next_condensedbold';
  src: url("/fonts/avenirnextcondensed-bold-webfont.woff2") format("woff2"), url("/fonts/avenirnextcondensed-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'avenir_next_condenseditalic';
  src: url("/fonts/avenirnextcondensed-italic-webfont.woff2") format("woff2"), url("/fonts/avenirnextcondensed-italic-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'avenir_next_condensedregular';
  src: url("/fonts/avenirnextcondensed-regular-webfont.woff2") format("woff2"), url("/fonts/avenirnextcondensed-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

.bold, .larger-heading, .apt-info h4, h2 b, .calloutLink, .listingContactLink, .lead-in .calloutLink, .lead-in .listingContactLink, .menu .primary-nav a:hover {
  font-family: 'avenir_next_condensedbold', sans-serif; }

.italic, .lead-in-text p {
  font-family: 'avenir_next_condenseditalic', sans-serif; }

.regular, .contact address, .apt-info dl dd, .apt-info dl, .content-block p, .content-block h3, h2, footer p, .fine-print, .menu, footer {
  font-family: 'avenir_next_condensedregular', sans-serif; }

:root {
  --navLinkBG: #7b322b;
  --navLinkActiveBG: #8a4d44;
  --greyText: #c9bfa1;
  --nobHillRed: #7a332c;
  --nobHillGrey: #666666; }

.nobHillRed, .contact address, .apt-info dl dd, .apt-info dl, .apt-info h4, .content-block h3, h2 {
  color: #7a332c; }

.vertical-padding, .content-block, .lead-in {
  padding-top: 3rem; }
  @media screen and (min-width: 75em) {
    .vertical-padding, .content-block, .lead-in {
      padding-top: 6rem; } }
* {
  box-sizing: border-box; }

a {
  cursor: pointer; }

body {
  margin: 0; }

html {
  font-size: 16px; }

nav {
  background: blue; }

nav {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 9998;
  top: 0;
  background: black;
  padding: 0; }
  @media screen and (min-width: 75em) {
    nav {
      position: fixed;
      width: 16rem;
      left: 0;
      top: 0;
      height: 100vh; } }
.content-wrapper {
  margin-top: 7.3rem; }
  @media screen and (min-width: 75em) {
    .content-wrapper {
      margin-top: 0;
      margin-left: 16rem; } }
footer {
  width: 100%;
  text-align: center;
  padding: 1.5rem 0;
  background-color: black;
  position: relative;
  z-index: 9999;
  letter-spacing: .1rem; }
  @media screen and (min-width: 75em) {
    footer {
      padding: .5rem 0 3rem 0;
      position: fixed;
      bottom: 0;
      width: 16rem;
      z-index: 9999; } }
.vh-spacer {
  background: white;
  margin-top: 80vh;
  position: relative;
  z-index: 9997; }
  @media screen and (min-width: 75em) {
    .vh-spacer {
      margin-top: 70vh; } }
.grid, .content-block, .lead-in {
  display: grid;
  width: 94%;
  max-width: 55rem;
  margin: 0 auto;
  box-sizing: border-box;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: 1.875rem; }

.lead-in {
  grid-template-columns: repeat(6, 1fr);
  grid-template-areas: "header header header header header header" "article article article article article article" "aside1 aside1 aside1 aside2 aside2 aside2"; }
  @media screen and (min-width: 75em) {
    .lead-in {
      grid-template-areas: "header header article article article article" "header header article article article article" "header header aside1 aside1 aside2 aside2"; } }
  .lead-in .lead-in-header {
    grid-area: header; }
  .lead-in .lead-in-text {
    grid-area: article; }
  .lead-in .lead-in-cta-1 {
    grid-area: aside1; }
  .lead-in .lead-in-cta-2 {
    grid-area: aside2; }

.content-block {
  margin-bottom: 6rem; }
  .content-block article {
    grid-column: span 12; }
  @media screen and (min-width: 75em) {
    .content-block .half-width {
      grid-column: span 6; } }
.section-break {
  margin: 0 0 -.25rem 0;
  border: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 0; }
  .section-break figure {
    margin: 0; }

.apt-listing {
  margin-bottom: 0; }

.apt-listing aside {
  grid-column: span 12;
  background: #e7e7e9; }

.apt-info {
  display: grid;
  grid-template-columns: repeat(16, 1fr);
  grid-column-gap: 0; }
  .apt-info div {
    padding: .5rem 3rem; }
  .apt-info .apt-bedrooms {
    grid-column: span 8;
    border-right: 2px solid #cccccd;
    border-bottom: 2px solid #cccccd; }
    @media screen and (min-width: 75em) {
      .apt-info .apt-bedrooms {
        grid-column: span 5; } }
  .apt-info .apt-bathrooms {
    grid-column: span 8;
    border-bottom: 2px solid #cccccd; }
    @media screen and (min-width: 75em) {
      .apt-info .apt-bathrooms {
        grid-column: span 5;
        border-right: 2px solid #cccccd; } }
  .apt-info .apt-sqfeet {
    grid-column: span 16;
    border-bottom: 2px solid #cccccd; }
    @media screen and (min-width: 75em) {
      .apt-info .apt-sqfeet {
        grid-column: span 6;
        border-right: none; } }
  .apt-info .apt-features {
    grid-column: span 16; }
    @media screen and (min-width: 75em) {
      .apt-info .apt-features {
        grid-column: span 6; } }
  .apt-info .apt-lease-terms {
    grid-column: span 16; }
    @media screen and (min-width: 75em) {
      .apt-info .apt-lease-terms {
        grid-column: span 6; } }
  .apt-info .apt-contact {
    grid-column: span 16; }
    @media screen and (min-width: 75em) {
      .apt-info .apt-contact {
        padding: 0 5rem 0 0;
        margin-top: 2.5rem;
        grid-column: span 4; } }
.menu_toggler {
  position: absolute;
  top: 2.25rem;
  right: 2rem;
  z-index: 9999;
  height: 2.5rem;
  width: 2.5rem;
  outline: none;
  cursor: pointer;
  display: flex;
  align-items: center; }
  .menu_toggler span,
  .menu_toggler span::before,
  .menu_toggler span::after {
    position: absolute;
    content: '';
    width: 2.5rem;
    height: 0.33rem;
    background-color: white;
    border-radius: 1rem;
    transition: 500ms cubic-bezier(0.77, 0, 0.175, 1); }
  .menu_toggler span {
    width: 1.75rem; }
  .menu_toggler span::before {
    top: -.75rem; }
  .menu_toggler span::after {
    top: .75rem; }
  .menu_toggler.active > span {
    background: transparent; }
  .menu_toggler.active > span::before, .menu_toggler.active > span::after {
    background-color: white;
    top: 0; }
  .menu_toggler.active > span::before {
    transform: rotate(-225deg); }
  .menu_toggler.active > span::after {
    transform: rotate(225deg); }
  @media screen and (min-width: 75em) {
    .menu_toggler {
      display: none; } }
.menu {
  position: fixed;
  left: -100%;
  z-index: 9999;
  color: #005c9c;
  width: 100%;
  height: 100%;
  padding: 0 0 0 0;
  display: flex;
  flex-direction: column;
  transition: 300ms left cubic-bezier(0.77, 0, 0.175, 1);
  background: var(--navLinkBG);
  letter-spacing: .1rem; }
  .menu ul.primary-nav {
    text-align: right;
    height: 100%;
    list-style-type: none; }
  .menu .primary-nav li {
    padding: 1rem 0;
    color: white; }
  .menu .primary-nav a {
    margin-right: 1rem;
    text-align: right;
    text-decoration: none;
    font-size: 1.66rem;
    line-height: 1.33;
    text-transform: uppercase;
    color: white; }
  @media screen and (min-width: 75em) {
    .menu {
      background: transparent;
      position: static;
      z-index: 9999;
      padding: 0; }
      .menu h1 {
        width: 16rem;
        position: relative; }
      .menu h1 img {
        position: absolute;
        width: 7rem;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        text-align: center;
        cursor: pointer; }
      .menu ul.primary-nav {
        margin: -2.5rem 0 0 0;
        padding: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: start; }
      .menu .primary-nav li {
        display: inline-block;
        width: 100%;
        text-align: left;
        padding: .1rem 0; }
      .menu .primary-nav a {
        color: #eee5d7;
        display: inline-block;
        min-width: 100%;
        height: 100%;
        font-size: 1rem;
        text-align: left;
        margin: 0;
        padding: .4rem 0 .3rem 1.5rem;
        background: #7b322b;
        transition: background-color 100ms ease-out; }
        .menu .primary-nav a:hover {
          background: #8a4d44; } }
.logo.hide-xlarge-up img {
  width: 4rem;
  margin: 0 1.5rem;
  padding: 0; }

.calloutLink, .listingContactLink, .lead-in .calloutLink, .lead-in .listingContactLink {
  display: inline-block;
  border: 2px solid #84352d;
  color: #84352d;
  background-color: transparent;
  padding: .75rem 1.33rem;
  margin: .5rem 0;
  font-size: .9375rem;
  transition-duration: 100ms;
  text-decoration: none; }
  .calloutLink:hover, .listingContactLink:hover {
    background-color: white;
    color: black;
    border-color: transparent; }

.calloutLinkLargeText {
  font-size: 1.5rem;
  text-transform: uppercase;
  font-weight: normal;
  letter-spacing: .3rem;
  text-align: center;
  min-width: 20rem; }
  .calloutLinkLargeText:hover {
    background-color: #7a332c;
    color: white; }

.lead-in .calloutLink, .lead-in .listingContactLink {
  width: 100%;
  text-align: center; }
  .lead-in .calloutLink:hover, .lead-in .listingContactLink:hover {
    background-color: #7a332c;
    color: white;
    border-color: white; }

.fine-print {
  color: #84352d;
  font-size: .66rem;
  font-style: normal; }

footer p {
  color: #84352d; }

address {
  font-style: normal; }

.bgvid {
  object-fit: cover;
  width: 100vw;
  height: 80vh;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden; }
  @media screen and (min-width: 75em) {
    .bgvid {
      height: 100vh; } }
.figure-third {
  display: none; }
  @media screen and (min-width: 65em) {
    .figure-third {
      display: block;
      grid-column: span 1; } }
  .figure-third img {
    height: 100%;
    width: 100%;
    max-width: 100%;
    object-fit: cover; }
    @media screen and (min-width: 75em) {
      .figure-third img {
        height: 30rem; } }
.figure-two-third {
  grid-column: span 3; }
  @media screen and (min-width: 65em) {
    .figure-two-third {
      grid-column: span 2; } }
  .figure-two-third img {
    height: 100%;
    width: 100%;
    max-width: 100%;
    height: 20rem;
    object-fit: cover; }
    @media screen and (min-width: 65em) {
      .figure-two-third img {
        height: 30rem; } }
.figure-full {
  grid-column: span 3; }
  .figure-full img {
    height: 100%;
    width: 100%;
    max-width: 100%;
    height: 20rem;
    object-fit: cover; }
    @media screen and (min-width: 65em) {
      .figure-full img {
        height: 30rem; } }
:root {
  /* Set fade in duration */
  --fade-time: 0.5s; }

.main-img img,
.imgs img {
  width: 100%;
  margin-bottom: -.22rem;
  padding: 0; }

.imgs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 0px; }

.imgs img {
  cursor: pointer; }

/* Fade in animation */
@keyframes fadeIn {
  to {
    opacity: 1; } }

.fade-in {
  opacity: 0;
  animation: fadeIn var(--fade-time) ease-in 1 forwards; }

.hero-image {
  height: 80vh;
  width: 100%; }
  @media screen and (min-width: 75em) {
    .hero-image {
      height: 100vh; } }
  .hero-image img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
    object-position: top center; }

h2 {
  font-size: 2.5rem;
  text-align: center;
  margin-bottom: 1rem;
  letter-spacing: .3rem; }
  h2 b {
    text-transform: uppercase; }

.history h2 {
  text-align: left;
  margin-bottom: -1rem; }

.lead-in-header h2 {
  margin: 0; }
  @media screen and (min-width: 75em) {
    .lead-in-header h2 {
      margin: 0 1rem 0 0; }
      .lead-in-header h2 span {
        display: block;
        text-align: right; } }
p {
  font-size: 1rem;
  margin: 1.5rem auto 2rem 0;
  text-align: left; }

.lead-in-text p {
  color: var(--nobHillGrey);
  font-size: 1.5rem;
  margin: 1rem auto;
  text-align: center;
  width: 66%; }
  @media screen and (min-width: 75em) {
    .lead-in-text p {
      text-align: left;
      margin: .5rem 0; } }
.content-block h3 {
  font-size: 2rem;
  letter-spacing: .3rem;
  text-transform: uppercase;
  margin-bottom: -1rem; }

.content-block p {
  color: var(--nobHillGrey);
  font-size: 1.33rem; }

.apt-info h4 {
  font-size: 1.33rem; }

.apt-features h4,
.apt-lease-terms h4,
.apt-contact h4 {
  text-transform: uppercase; }

.apt-info dl {
  margin-top: -1rem;
  font-size: 1.33rem; }
  .apt-info dl dt {
    margin-top: .33rem; }
  .apt-info dl dd {
    font-size: 1rem;
    margin-left: 0; }

.listingContactLink {
  background-color: var(--nobHillRed);
  color: #e7e7e9;
  text-transform: uppercase;
  text-align: center;
  font-size: 1.33rem;
  width: 100%; }
  .listingContactLink:hover {
    border-color: var(--nobHillRed);
    cursor: pointer; }

.larger-heading {
  text-align: left;
  padding-bottom: 2rem;
  font-size: 120%;
  text-transform: uppercase;
  color: black; }

.contact .larger-heading {
  margin-top: -30px;
  margin-bottom: -2px; }

.contact .larger-heading-getintouch {
  margin-bottom: -40px; }

.map {
  margin: 0; }

.map img {
  width: 73%;
  height: auto; }

.typeform-embed {
  width: 100%;
  height: 340px;
  margin-top: -40px; }

.apt-listing .unavailable-heading {
  font-size: 30px; }

.contact {
  padding-bottom: 6rem; }

.contact address {
  font-size: 2.5rem;
  text-align: left;
  margin-bottom: 1rem;
  letter-spacing: .3rem; }

footer address p {
  text-align: center; }

.menu.active {
  left: 0; }