/*! 500 Crawford Style Sheet  */

@font-face {
    font-family: "DINWebPro";
    src: url(../fonts/DINWebPro.woff) format("woff")
}
@font-face {
    font-family: "DINWebProCondBold";
    src: url(../fonts/DINWebPro-CondBold.woff) format("woff")
}
@font-face {
    font-family: "Plantin";
    src: url(../fonts/Plantin.woff) format("woff")
}
@font-face {
    font-family: "DINWebProMedium";
    src: url(../fonts/DINWebPro-Medium.woff) format("woff")
}
@font-face {
    font-family: "PlantinItalic";
    src: url(../fonts/Plantin-Italic.woff) format("woff")
}

@import url('https://fonts.googleapis.com/css?family=Playfair+Display');

html {
    box-sizing: border-box
}
*, :after, :before {
    box-sizing: inherit
}
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: middle
}
h1, h2, h3, p {
    border: 0;
    font: inherit;
    vertical-align: middle
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}
ol, ul {
    list-style: none
}
.clearfix:after, .group:after {
    content: "";
    display: table;
    clear: both
}
a, body {
    color: #444;
}
body, p {
    font-size: 16px
}
body {
    background: #f7f7f4;
    font-family: Plantin, georgia, "times new roman", serif;
    line-height: 1.48;
    font-weight: 300
}

body.hero-slider.scrolling {
	border-top: 0 solid transparent;
}

h1, h2, h3 {
    font-family: DINWebProCondBold, arial, sans-serif;
    margin: 0
}
h1 {
    font-size: 1.75em;
    padding: 1.82143em 0
}
h2 {
    font-size: 2.25em;
    padding: 1em 0
}
h3 {
    font-size: 1.675em;
    padding: 1.25em 0
}
h4 {
    font-size: 1.5em;
    font-weight: 700;
    font-family: DINWebProCondBold, arial, sans-serif
}
p {
    color: #444;
    line-height: 1.5em;
    font-weight: 600;
    margin: 0 auto 20px;
    width: 100%
}
a {
    text-decoration: none;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out
}
a, li, p {
    font-family: "DINWebPro", serf
}
a:hover {
    color: #ccc
}
.italics {
    font-style: italic
}
.text-center {
    text-align: center!important
}
.left {
    float: left
}
.right {
    float: right
}
hr.clear, hr.clear-small {
    width: 100%;
    height: 0;
    padding: 0;
    clear: both
}
hr.clear {
    background: 0 0;
    float: none;
    border: 0;
    margin: 0 auto
}
hr.clear-small {
    border: 1px solid #eee;
    margin: 30px auto
}
hr.clear-bar, hr.flat-clear, hr.pretty-clear {
    clear: both;
    border: 0;
    width: 100%;
    display: block
}
hr.clear-bar {
    padding-top: 39px;
    border-bottom: 1px solid #ccc;
    margin: 0 auto 40px;
    height: 1px
}
#callout h3, hr.clear-bar.sans-bottom {
    padding-bottom: 0
}
hr.flat-clear, hr.pretty-clear {
    height: 0;
    padding: 0;
    margin: 0 auto
}
hr.pretty-clear {
    width: 10%;
    margin: 30px auto;
    height: 5px;
    background: #fff
}
.inner-wrapper {
    position: relative;
    padding-left: 40px;
    padding-right: 40px;
    width: 100%
}
.one-fourth {
    width: 25%
}

.one-fifth {
    width: 20%;
}
.three-fourths {
    width: 75%
}

.four-fifths {
    width: 80%;
}

.one-third {
    width: 33.33%
}
.two-thirds {
    width: 66.6%
}
.two-fifths {
    width: 40%
}
.three-fifths {
    width: 60%
}
.one-half {
    width: 50%
}
.box-centered {
    display: block;
    margin-right: auto;
    margin-left: auto;
    position: relative
}
.full-width-section {
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding: 60px 0
}
.full-width-section.sans, p {
    padding: 0
}
.text-box {
    padding-right: 30px;
    padding-left: 30px
}
h2.section-heading, ul.text-list li {
    padding-bottom: .5em
}
p.large {
    padding-bottom: 30px;
    width: 66%;
    font-size: 1.2rem
}
ul.text-list {
    list-style-type: disc
}
ul.text-list li {
    font-size: 18px;
	font-weight: 400;
	text-transform: capitalize;
}
.white-bg {
    background: #fff
}
.whitesmoke {
    background: #eee
}
.light-grey {
    background: #727b77
}
.dark-grey {
    background: #384144
}
.text-center {}
#header, .button, a.tooltips span {
    text-align: center
}
.button {
    background: #183d4e;
    color: #fefefe;
    font-family: "DINWebPro", serif;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .18);
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .18);
    padding: .75em 1.25em
}
.button:hover {
    color: #fff;
    background: #2a6a87;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .3);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .3)
}
#callout h3 {
    padding-top: 0
}
a.tooltips {
    position: relative;
    display: inline
}
a.tooltips span {
    position: absolute;
    top: -100%;
    width: auto;
    color: #333;
    background: #fff;
    height: auto;
    padding: 20px 30px;
    line-height: 60px;
    visibility: hidden;
    border-radius: 2px
}
a.tooltips span:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid #eee;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent
}
a:hover.tooltips span {
    visibility: visible;
    opacity: .8;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999
}
#header {
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid #fefefe;
    position: fixed;
    margin: 0 auto;
    padding: 0;
    top: 0;
    width: 100%;
    height: 108px;
    z-index: 1000;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
    -webkit-box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .08)
}
#header.scrolling {
    height: 82px
}
#header.neighborhood {
    z-index: 100000!important
}
#header.hide {
    top: -138px
}
#header .header-content {
    width: 100%;
    position: relative;
    margin: 0 auto;
    padding: 0;
    height: 82px
}
.pushed #header {
    position: relative;
    z-index: 10000
}
#header #logo-container {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0
}
#header #logo-container #top-logo {
    width: 210px;
    height: 80px;
    background: url(../img/logo-dark.png) center center no-repeat;
    background-size: 183px 46px
}
#header .nav-container, #top-bar {
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out
}
#header .nav-container {
    display: inline-block;
    text-align: center;
    width: 100%;
    height: 82px
}
#header .nav-container ul li, .button {
    display: inline-block
}
#header .nav-container ul li a {
    color: #444;
    font-size: 14px
}
#header .nav-container ul.info-nav li {
    margin-left: 1em;
    font-size: 13px
}
#header .nav-container .main-nav, #top-bar {
    height: 100%
}
#header .nav-container .main-nav li {
    margin-left: .5em;
    margin-right: .5em;
    line-height: 83px
}
#header .nav-container .main-nav a {
    font-size: 21px!important;
    font-family: DINWebProCondBold, arial, serif;
    padding-bottom: .25em;
    text-transform: Capitalize;
    color: #444
}
#header .nav-container .main-nav a.active, #header .nav-container .main-nav a:hover {
    border-bottom: 2px solid #444
}
#top-bar {
    max-height: 26px;
    border-bottom: 1px solid #e2e4e6;
    padding-left: 10px;
    padding-right: 10px
}
#header.scrolling #top-bar {
    overflow: hidden;
    border-bottom: none;
    max-height: 0;
    transform: translateY(-26px)
}
#top-apply, #top-bar a {
    text-transform: uppercase
}
#top-bar a {
    display: inline-block;
    padding: 0 15px;
    border-right: 1px solid #e2e4e6;
    border-left: 1px solid #e2e4e6;
    line-height: 25px;
    font-weight: 600;
    font-size: .755rem;
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    -ms-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out
}
#top-bar a:hover {
    color: #777;
    background: #eee
}
#top-bar a.resident-portal {
    color: #fff;
    padding: 0 15px;
    line-height: 25px;
    background: #183d4e
}
#top-bar a.resident-portal:hover {
    background: #2a6a87
}
#top-bar a.social-link {
    font-size: 1.2rem;
    line-height: 25px;
    padding-left: 5px;
    padding-right: 5px
}
#top-bar a.social-link:before {
    top: 2px!important;
    position: relative
}
#top-apply {
    -webkit-border-radius: 3px 3px;
    border-radius: 3px 3px;
    position: absolute;
    top: 25%;
    right: 20px;
    -webkit-transition: all 75ms ease-in-out;
    -moz-transition: all 75ms ease-in-out;
    -ms-transition: all 75ms ease-in-out;
    -o-transition: all 75ms ease-in-out;
    transition: all 75ms ease-in-out;
    font-size: .8rem;
    letter-spacing: .02em
}
.scrolling #top-apply {
    right: 0;
    top: 0;
    height: 82px;
    line-height: 82px;
    padding: 0 20px;
    border-radius: 0;
    -webkit-border-radius: 0
}
#header-incentive, #header.scrolling #header-incentive, .scrolling #top-apply {
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out
}
#header-incentive {
    background: rgba(24, 61, 78, .8);
    height: 1000px;
    overflow: hidden;
    display: none!important;
    max-height: 55px;
	text-transform: uppercase;
}
body.index #header-incentive {
    display: block!important
}
#header.scrolling #header-incentive {
    max-height: 0
}
#header-incentive a, #header-incentive p {
    color: #fff;
    text-align: center;
    line-height: 55px;
    margin-bottom: 0;
    padding-top: 2px;
    letter-spacing: .02em;
    font-family: DINWebProCondBold, arial, serif;
    font-size: 1.4rem
}
#header-incentive a.button, .callout-box .callout-button {
    font-family: DINWebProCondBold, arial, sans-serif;
    background: #fff34e;
    color: #444;
    line-height: 1em;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    text-transform: uppercase
}
#header-incentive a.button {
    padding: 8px 10px 5px;
    margin-left: .5em;
    display: inline-block;
    position: relative;
    top: -2px;
    font-weight: 400;
    font-size: 1rem
}
#header-incentive .fi-die-one {
    font-size: .675rem;
    padding-left: 5px;
    padding-right: 5px
}
@media only screen and (max-width:722px) {
    body.index #header #header-incentive {
        display: none!important
    }
}
#callout {
    overflow: hidden
}
#hero, .callout-box {
    position: relative;
    overflow: hidden
}
.callout-box {
    min-height: 300px;
    padding: 0;
    margin: 0;
	background: #f1f1f1;
}
.callout-box>div {
    padding: 60px 80px
}
.callout-box h1 {
    font-size: 41px;
    color: #444;
    line-height: 1.2em;
    padding: 0 10px
}
.callout-box h3 {
    color: #444;
}
.callout-box p {
    font-size: 18px;
    color: #444;
    line-height: 1.65em;
    padding-top: 20px;
    padding-bottom: 5px
}
.callout-box .callout-button {
    width: 25%;
    padding-top: 19px;
    font-weight: 700;
    font-size: 1.3rem
}
#hero {
    width: 100%;
	min-height: 75vh;
    min-width: 100%;
	max-height: 100vh;
	overflow: hidden;
    background-image: url(../img/home-bg.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}
@media only screen and (max-width:1250px) and (min-width:722px) {
    #hero {
        background: url(../img/hero-bg.jpg) no-repeat center center fixed
    }
    #hero-slider {
        display: none!important
    }
}
#direction-bar, #hero:after {
    width: 100%;
    position: absolute;
    bottom: 0
}
#hero:after {
    content: '';
    background: rgba(0, 0, 0, .05);
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    z-index: 99
}
#hero .center-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    z-index: 100
}
#direction-bar a, #hero .center-logo, #hero .center-logo.hidden {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
#hero .center-logo.hidden {
    z-index: -1;
    opacity: 0
}
#hero .center-logo img {
    width: 200px;
    display: none;
}

@media screen and (max-width:721px) {
    #hero .center-logo img {
        width: 200px;
        display: block;
    }
}
@media screen and (min-width:1350px) {
    #hero .center-logo img {
        width: 220px
    }
}
#direction-bar {
    background: 0 0;
    height: 60px;
    z-index: 100
}
#direction-bar a {
    opacity: .7;
    width: 60px;
    height: 60px;
    display: inline-block;
    background-size: 38px 38px;
    background-repeat: no-repeat;
    background-position: center center
}
#direction-bar div.left:first-child a {
    border-right: 1px solid rgba(255, 255, 255, .1)
}
#direction-bar div.right:last-child a {
    border-left: 1px solid rgba(255, 255, 255, .1)
}
#direction-bar a:hover {
    cursor: pointer;
    opacity: 1
}
#direction-bar a.right {
    border-right: 1px solid rgba(255, 255, 255, .1)
}
#direction-bar a.left {
    border-left: 1px solid rgba(255, 255, 255, .1)
}
#direction-bar a#phone {
    background-image: url(../img/icon-phone.png)
}
#direction-bar #phone.tooltips span {
    width: 287%
}
#direction-bar a#text {
    background-image: url(../img/icon-email.png)
}
#direction-bar a#map {
    background-image: url(../img/icon-location.png)
}
#direction-bar a#appointment {
    background-image: url(../img/icon-person.png)
}
#direction-bar #down-arrow {
    opacity: 1;
    width: 50px;
    height: 50px;
    display: inline-block;
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    background-size: 38px 38px;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 50% 50%;
    z-index: 1
}
#direction-bar #down-arrow:before {
    content: url(https://www.500crawford.com/img/icons/icon-down-inner.png);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-30%)
}
#direction-bar #down-arrow:hover {
    cursor: pointer;
    background-position: center bottom
}
#hero-slider, #hero-slider img {
    width: 100%;
    min-height: 100vh;
}

    #hero-slider .slider-content {
        width: 170px;
        height: 170px;
        position: absolute;
        bottom: 20px;
        left: 20px;
        z-index: 1000000000;
    }

        #hero-slider .slider-content img {
            width: 100%;
        }
#direction-bar #down-arrow, #hero-map, #hero-map.active {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
#hero-map {
    width: 100%;
    height: 100vh;
    z-index: -1;
    opacity: 0
}
#hero-map.active {
    z-index: 100;
    opacity: 1
}
#top-bar a.home-map {
    background: #183d4e;
    color: #fff;
    border-right: #245b74
}
#home-map {
    border-top: none;
    border-bottom: 1px solid #eee;
    background: url(../img/dark-geo-bg.jpg);
    padding: 100px 40px;
    -webkit-box-shadow: inset 0 0 18px 0 rgba(0, 0, 0, .6);
    box-shadow: inset 0 0 18px 0 rgba(0, 0, 0, .6)
}
#home-map .home-map-wrap {
    max-width: 1180px;
    margin-right: auto;
    margin-left: auto;
    position: relative
}
#home-map .home-map-image {
    -webkit-box-shadow: 0 0 6px 0 rgba(255, 255, 255, .4);
    box-shadow: 0 0 6px 0 rgba(255, 255, 255, .4)
}
#home-map .text-box {
    color: #fff;
    padding-top: 1%
}

#bottom-callout p, #home-map .callout-button, #home-map p {
    margin-right: auto;
    margin-left: auto
}

body.amenities #bottom-callout {
	display: none !important;
}

body.features #bottom-callout {
	display: none !important;
}

body#neighborhood #bottom-callout {
	display: none !important;
}
body.gallery #bottom-callout {
	display: none !important;
}	
#home-grid li h3, #home-map p {
    font-size: 1rem;
    letter-spacing: .02em
}
#home-map p {
    color: #efefef;
    width: 95%;
    text-align: left;
    font-weight: 600;
    line-height: 1.4em;
    margin-bottom: 40px
}
#home-map .text-box h4 {
    font-size: 2.4rem;
    color: #eee;
    text-transform: capitalize;
    line-height: 1em
}
#home-map .text-box h3 {
    margin-top: 10px;
    font-size: 2.5rem;
    padding: 0 0 5px;
    text-transform: uppercase;
    text-shadow: 0 0 3px #444
}
#home-map .text-box h2 {
    color: #183d4e;
    font-size: 8rem;
    margin: 5px auto 40px;
    line-height: .9em;
    background: #fff;
    vertical-align: middle;
    padding: 40px 30px 10px;
    display: inline-block;
    width: auto;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .3);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .3)
}

hr.clear-pretty {
    width: 20%;
    display: block;
    height: 3px;
    margin: 15px auto;
    background: #183d4e;
}

#home-map hr.clear-pretty {
    width: 20%;
    display: block;
    height: 3px;
    margin: 15px auto;
    background: #fff
}
#home-map .callout-button {
    width: 45%;
    display: block
}
@media screen and (max-width:721px) {
    #home-map {
        padding-left: 10px;
        padding-right: 10px
    }
    #home-map .text-box {
        padding: 20px 5px
    }
    #home-map .text-box h4 {
        font-size: 2rem;
        margin-top: 20px
    }
}
#home-grid ul {
    position: relative;
    width: 100%;
    padding: 0;
    background-color: #000
}
#home-grid ul li {
    position: relative;
    width: 33.33333%;
    padding-bottom: 33.33333%;
    border: 3px solid #fff;
}

@media screen and (max-width: 980px) {
	#home-grid ul li {
		border: none;
	}
}

#home-grid ul li>a {
    overflow: hidden
}
#home-grid .box-bg, #home-grid .box-wrap, #home-grid ul li>a {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}
#home-grid .box-bg {
    z-index: 10;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-transition: -webkit-transform .4s cubic-bezier(.785, .135, .15, .86);
    -moz-transition: -moz-transform .4s cubic-bezier(.785, .135, .15, .86);
    transition: transform .4s cubic-bezier(.785, .135, .15, .86)
}
#home-grid .box-wrap {
    z-index: 20;
    background-color: rgba(0, 0, 0, .7);
    opacity: 0;
    -webkit-transition: opacity .4s;
    -moz-transition: opacity .4s;
    transition: opacity .4s
}
#home-grid .box-wrap>div {
    display: table;
    height: 100%;
    width: 100%
}
#home-grid .box-wrap>div>div {
    display: table-cell;
    vertical-align: middle;
    padding: 0 80px;
    color: #fff
}
#gallery .sort-item img:hover, #home-grid ul li>a:hover .box-wrap {
    opacity: 1
}
#home-grid li>a:hover .box-bg {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2)
}
#home-grid li a h2, #home-grid li a h3, #home-grid li a p, #home-grid li a span {
    opacity: 0
}
#home-grid li a:hover h2, #home-grid li a:hover h3, #home-grid li a:hover p, #home-grid li a:hover span {
    -webkit-animation: fadeInUp .4s cubic-bezier(.785, .135, .15, .86) .15s forwards;
    -moz-animation: fadeInUp .4s cubic-bezier(.785, .135, .15, .86) .15s forwards;
    animation: fadeInUp .4s cubic-bezier(.785, .135, .15, .86) .15s forwards
}
#home-grid li h2 {
    line-height: 1.2em;
    font-size: 2.4rem;
    padding-top: 0;
    letter-spacing: 1px;
    padding-bottom: 10px;
    font-family: DINWebProCondBold, arial, sans-serif;
}
#home-grid li h3 {
    border-bottom: 1px solid rgba(255, 255, 255, .3);
    line-height: 1.2em;
    font-family: DINWebProCondBold, arial, sans-serif;
    padding-top: 0;
    padding-bottom: 10px;
    margin-bottom: 30px;
    text-transform: normal;
    font-weight: 300;
	font-size: 1.4rem;
}
#about-finger-companies p.large {
    line-height: 1.7em;
    font-size: 1.2rem;
    padding-left: 0;
    width: 100%
}
#slider {
    width: 100%;
    overflow: hidden;
    border-top: none;
    border-bottom: 1px solid #eee
}

@media screen and (min-width:1600px) {
    #slider {
        padding: 80px 40px;
        background: url(img/dark-geo-bg.jpg);
    }

        #slider {
            margin-right: auto;
            margin-left: auto;
            height: auto;
        }

}

#bottom-callout h2 {
    padding-top: 0
}

.callout-button {
    width: 45%;
    display: inline-block
}
#bottom-callout p {
    max-width: 910px;
    margin-bottom: 30px
}
.section-header {
    position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    height: 70vh
}
.section-header h2,
.section-header h1 {
    color: #fff;
    font-size: 3rem;
    text-align: center;
    text-shadow: 0 2px rgba(0, 0, 0, .3);
    position: absolute;
    width: 100%;
    top: 60%;
    padding: 0;
    margin: 0;
    text-transform: uppercase;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%)
}

.section-header img {
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 0;
    z-index: 1;
    display: none !important;
}

#about-finger-companies {

}
#about-finger-companies h2 {
    line-height: 1.1em;
}
#about-finger-companies #home-read-more {
    max-width: 240px;
    font-weight: 600;
    letter-spacing: .08em;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    font-size: .875rem;
    text-transform: uppercase;
}
#about-finger-companies #read-more-block {
    padding: 0;
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    -ms-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    height: auto;
    max-height: 0;
    overflow: hidden;
}

#about-finger-companies #read-more-block.active {
    max-height: 1000000px;
    padding-bottom: 40px;
}

    #about-finger-companies #read-more-block ul.text-list {
        list-style-type: disc;
        padding-left: 40px;
        margin-bottom: 30px;
    }

/* Section Header Wide Screens
--------------------------------------*/

@media screen and (min-width: 800px) {

    .section-header {
        height: 60vh;
        position: relative;
    }

    .section-header h2 {
        position: absolute;
        text-align: center;
        left: 50%;
        top: 50%;
        transform: translateX(-50%) translateY(15%);
        -webkit-transform: translateX(-50%) translateY(15%);
        z-index: 100;
    }

    .section-header img {
        position: relative;
        display: block !important;
    }
}



#floor-plans-container #filter-sort {
    text-align: center
}
#floor-plans-container #filter-sort span, #gallery-container #filter-sort span {
    background: #fefefe;
    display: inline-block;
    text-align: center;
    padding: 5px 15px;
    margin-left: .5em;
    margin-right: .5em;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .3);
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .3)
}
#floor-plans-container #filter-sort span:hover {
    background: #183d4e;
    color: #fff;
    cursor: pointer
}
#floor-plans-container #filter-sort span.active {
    background: #183d4e;
    color: #fff
}
#floor-plans-container #floor-plans {
    padding-top: 40px
}
#floor-plans .one-third.floor-plan, #floor-plans .sort-item, #floor-plans .sort-item.active, #floor-plans-container #filter-sort span.active {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
#floor-plans .one-third.floor-plan {
    background: #384144;
    width: 31%;
    text-align: center;
    margin-right: 1%;
    margin-left: 1%;
    margin-bottom: 2%;
    -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .18);
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .18)
}
#floor-plans .one-third.floor-plan:hover {
    background: #2a6a87;
    cursor: pointer
}
#floor-plans .sort-item, #floor-plans .sort-item.active {
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}
#floor-plans .sort-item {
    overflow: hidden;
    position: relative;
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}
#floor-plans .sort-item h2 {
    color: #fefefe;
    padding-top: 20px;
    padding-bottom: 10px;
    line-height: 1em
}
#floor-plans .sort-item h3 {
    color: #fefefe
}
#floor-plans .sort-item img {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    display: block;
    text-align: center
}
#single-callout-button, .pop-plan .fp-info a {
    display: block;
    max-width: 310px;
    margin-right: auto;
    margin-left: auto;
    text-align: center
}
#single-callout-button {
    width: 50%
}
.pop-plan {
    display: none
}
.pop-plan .fp-info {
    color: #fff;
    padding: 10% 40px 20px;
    width: 30%
}
.pop-plan .fp-info h2 {
    border-bottom: 1px solid #eee;
    padding-bottom: 0;
    font-size: 3rem;
    margin-bottom: 30px;
    line-height: 1.2em
}
#floor-plans .sort-item h3, .pop-plan .fp-info h3 {
    padding-top: 0;
    padding-bottom: 10px
}
.pop-plan .fp-info h5 {
    text-align: center;
    padding-bottom: 15px
}
.pop-plan .fp-info .price-note {
    font-family: "DINWebPro", serf;
    text-align: center;
    font-size: .675rem;
    color: #eee;
    padding-bottom: 30px;
    display: none
}
.pop-plan .fp-info a {
    border: 2px solid #fff;
    font-weight: 600;
    letter-spacing: .1em;
    font-size: .775rem;
    text-transform: uppercase;
    padding: 15px 20px;
    color: #fff
}
.pop-plan .floor-plan-wrap {
    width: 70%;
    position: relative;
    background: #fff;
    float: left
}
.floor-plan-wrap img {
    width: 75%;
    margin: 0 auto;
    display: block;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px
}
.fancybox-close {
    width: 25px;
    height: 25px;
    background: url(../img/close-button.png) center center no-repeat;
    position: absolute;
    top: 30px;
    right: 45px;
    z-index: 1000000
}
@media only screen and (max-width:722px) {
    .pop-plan .floor-plan-wrap, .pop-plan .fp-info, .pop-plan img {
        width: 100%
    }
    .pop-plan .fp-info h2 {
        font-size: 2rem
    }
    .pop-plan .fp-info h3 {
        padding-bottom: 20px
    }
}
.pop-plan .fp-tour-request {
    margin-top: 20px
}
.pop-plan .contact-box-fp {
    width: 70%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    bottom: 0;
    background: #ddd
}
.pop-plan .contact-box-fp.active {
    opacity: 1;
    z-index: 10000000
}
#walkscore, .feature-box {
    padding-top: 40px;
    padding-bottom: 40px
}
.feature-box {
    border-bottom: 1px solid #ccc;
    width: 100%;
    margin: 0 auto
}
.feature-box.first {
    border-top: 1px solid #ccc
}
.amenities .section-intro p.large {
    margin-bottom: 40px
}

.header-spacing {
    padding-top: 110px;
}

.section-intro .feature-button {
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 60px
}

.section-intro h3 {
	font-size: 2.25rem;
	color: #444;
}
.feature-box .feature-photo img {
    float: left;
    width: 100%
}
.feature-box .feature-text {
    padding: 0 40px
}
#walkscore h2.hood-title, .feature-box .feature-text h2 {
    line-height: 1em;
    padding-top: 20px;
    padding-bottom: 5px
}
.feature-box .feature-text h3 {
    padding-top: 0;
    padding-bottom: 5px
}
#home-map .text-box h4, .feature-box .feature-text p {
    padding-top: 0;
    margin: 0 auto;
    padding-bottom: 0
}
.feature-box ul {
    list-style-type: disc;
    padding: 15px 0 10px 20px
}
.feature-box ul li {
	font-family: "open sans", arial;
    font-weight: 400;
    padding-bottom: 7px;
    font-size: 1.15rem;
    color: #333;
    text-transform: capitalize;
}
#property-container .feature-box {
    padding-top: 60px;
    padding-bottom: 60px
}
.feature-box h2.property-name {
    padding-top: 0
}
#neighborhood .section-header {
    height: 80vh
}
#walkscore {
    position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center
}
#neighborhood-map-container {
    width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
    z-index: 10000;
    height: 80vh;
    margin: 0 auto 60px;
    position: relative;
    overflow: hidden;
}
#neighborhood-map {
    height: 100%;
    width: 100%;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
}
#category-container {
    width: 20%;
    height: 80vh;
    float: left;
    background: #333
}
#neighborhood .location {
	position: relative;
	max-width: 280px;
	width: 100%;
}

#neighborhood .location img {
	width: 100%;
	height: auto;
}
#neighborhood .location .text-box {
    padding: 20px 0 20px 20px
}
#neighborhood .location .text-box h2 {
    margin: 0 auto;
    padding: 10px 0;
    color: #444;
    font-size: 1.8rem;
	text-align: center;
}
#neighborhood .location .text-box h4.block-report {
    color: #444;
    padding-bottom: 10px;
    font-size: 1rem
}
#neighborhood .location .text-box a {
    color: #444
}
#walkscore {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 110px;
}
#walkscore .score-box {
    width: 31%;
    text-align: center;
    outline: 3px solid #fff;
    margin-left: 1%;
    margin-right: 1%;
    display: inline-block;
    float: none!important
}
#walkscore h2.hood-title {
    font-size: 5rem;
    text-align: center;
    padding-bottom: 0;
    position: relative;
    bottom: -15px
}
#walkscore h2.hood-title, .score-box h2, .score-box h3 {
    color: #fff;
    text-transform: uppercase
}
.score-box h2 {
    padding-bottom: 10px;
    margin-bottom: 0;
    font-size: 3rem
}
.score-box h3 {
    position: realtive;
    font-size: 10rem;
    padding-top: 0;
    padding-bottom: 0;
    border-radius: 50% 50%;
    display: block;
    margin: 0 auto
}

/* Updated Map Styles
----------------------------*/

.map-intro {
    background: #183d4e;
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    margin: 0 auto;
    position: relative;
}

    .map-intro p {
        color: #fff;
        font-weight: 300;
        font-size: 1.4rem;
        text-align: center;
        padding: 0;
        margin: 0 auto;
    }

#map-list {
    width: 250px;
    position: absolute;
    top:0;
    overflow: hidden;
    left: 0;
    z-index: 10000000;
    background: #384144;
    height: 100%;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

#neighborhood-map-container.closed #map-list {
    transform: translateX(-100%);
}


    #map-list img.map-logo {
        margin: 0 auto;
        width: 100%;
        height: auto;
    }

    #category-list {
        width: 100%;
        height: 100%;
        overflow-y: auto;
        opacity: 1;
        -webkit-transition: all 150ms ease-in-out;
        -moz-transition: all 150ms ease-in-out;
        -ms-transition: all 150ms ease-in-out;
        -o-transition: all 150ms ease-in-out;
        transition: all 150ms ease-in-out;
    }

    #category-list.hide {
        opacity: 0;
        -webkit-transition: all 150ms ease-in-out;
        -moz-transition: all 150ms ease-in-out;
        -ms-transition: all 150ms ease-in-out;
        -o-transition: all 150ms ease-in-out;
        transition: all 150ms ease-in-out;
    }

    #category-list h4 {
            background: #E8E8E8;
            padding: 15px 0;
            font-size: 1.3rem;
            color: #384144;
            text-align: left;
            padding-left: 30px;
            display: block;
            margin-top: 5px;
            margin-bottom: 5px;
            -webkit-transition: all 150ms ease-in-out;
            -moz-transition: all 150ms ease-in-out;
            -ms-transition: all 150ms ease-in-out;
            -o-transition: all 150ms ease-in-out;
            transition: all 150ms ease-in-out;
            -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
            box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
        }

        #category-list h3:hover,#category-list h4:hover {
            cursor: pointer;
            background: #fff;
        }

        /* List Containers */

        #list-container {
            padding-top: 10px;
            width: 100%;
            height: 100%;
            background: #384144;
            position: relative;
        }

            #list-container .list-items {
                width: 100%;
                height: 100%;
                background: #384144;
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                transform: translateX(100%);
                -webkit-transition: all 150ms ease-in-out;
                -moz-transition: all 150ms ease-in-out;
                -ms-transition: all 150ms ease-in-out;
                -o-transition: all 150ms ease-in-out;
                transition: all 150ms ease-in-out;
                z-index: 100000000;
                overflow-y: auto;
            }

            #list-container .list-items.active {
                transform: translateX(0);
                -webkit-transition: all 150ms ease-in-out;
                -moz-transition: all 150ms ease-in-out;
                -ms-transition: all 150ms ease-in-out;
                -o-transition: all 150ms ease-in-out;
                transition: all 150ms ease-in-out;
            }

                #list-container .list-items h3.all-categories {
                    background: #E8E8E8;
                    width: 90%;
                    padding-top: 10px;
                    padding-bottom: 10px;
                    margin: 0 auto;
                    margin-bottom: 20px;
                    text-align: center;
                    font-size: 1.4rem;
                    color: #384144;
                    letter-spacing: .02em;
                    text-transform: capitalize;
                    text-align: center;
                    -webkit-transition: all 150ms ease-in-out;
                    -moz-transition: all 150ms ease-in-out;
                    -ms-transition: all 150ms ease-in-out;
                    -o-transition: all 150ms ease-in-out;
                    transition: all 150ms ease-in-out;
                    -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
                    box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
                }

                #list-container .list-items h3.all-categories:hover {
                    background: #fff;
                    cursor: pointer;
                }

                #list-container .list-items h4 {
                    background: #E8E8E8;
                    padding: 15px 0;
                    font-size: 1.3rem;
                    color: #384144;
                    text-align: left;
                    padding-left: 30px;
                    display: block;
                    margin-top: 5px;
                    margin-bottom: 5px;
                    -webkit-transition: all 150ms ease-in-out;
                    -moz-transition: all 150ms ease-in-out;
                    -ms-transition: all 150ms ease-in-out;
                    -o-transition: all 150ms ease-in-out;
                    transition: all 150ms ease-in-out;
                    -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
                    box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
                }

                #list-container .list-items ul {
                    list-style-type: none;
                    padding: 0;
                    margin: 0;
                    position: relative;
                }

                #list-container .list-items ul li {
                    color: #fff;
                    width: 100%;
                    border-bottom: 1px solid #b1b1b1;
                    padding-top: 10px;
                    padding-bottom: 10px;
                    text-align: left;
                    padding-left: 40px;
                    padding-right: 15px;
                    display: block;
                    font-size: .875rem;
                    -webkit-transition: all 150ms ease-in-out;
                    -moz-transition: all 150ms ease-in-out;
                    -ms-transition: all 150ms ease-in-out;
                    -o-transition: all 150ms ease-in-out;
                    transition: all 150ms ease-in-out;
					background: #183D4E;
                }

                #list-container .list-items ul li:hover {
                    background: #505B60;
                    cursor: pointer;
                }


    #map-toggle {
        position: absolute;
        top: 8px;
        height: 40px;
        width: 40px;
        font-size: 1.8rem;
        font-family: "DINWebPro", arial, sans-serif;
        padding: 0;
        color: #f5f5f5;
        line-height: 35px;
        text-align: center;
        z-index: 1000000000;
        left: 210px;
        text-transform: uppercase;
        -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,0);
        box-shadow: 0 2px 4px 0 rgba(0,0,0,0);
        -webkit-transition: all 150ms ease-in-out;
        -moz-transition: all 150ms ease-in-out;
        -ms-transition: all 150ms ease-in-out;
        -o-transition: all 150ms ease-in-out;
        transition: all 150ms ease-in-out;
    }

    #map-toggle i {
        line-height: 45px;
    }

    #map-toggle:hover {
        color: #fff;
        cursor: pointer;
    }

    #neighborhood-map-container.closed #map-toggle {
        left: 0;
        top: 60px;
        background: #183d4e;
        -webkit-box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
        box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
    }

@media screen and (max-width:721px) {
    .map-intro p {
        font-size: 13px;
        padding-left: 15%;
        padding-right: 15%;
    }

    #neighborhood-map-container {
        overflow: visible;
        margin-bottom: 30px;
    }

    #neighborhood-map-container {
        height: auto;
    }


    #map-list {
        display: block;
        width: 100%;
        padding-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
        margin: 0 auto 15px;
        position: relative;
        top: 0;
        left: 0;
        height: 60vh;
    }

    #list-container .list-items {
        transform: translateX(-130%);
        padding-left: 30px;
        padding-right: 30px;
    }

    #list-container .list-items ul {
        padding-bottom: 15px;
    }

    #neighborhood-map {
        position: relative;
        top: 0;
        left: 0;
        margin-bottom: 0px;
        height: 60vh;
    }

}

/* End Updated Map Styles
----------------------------*/

@media screen and (max-width:721px) {
    #walkscore h2.hood-title {
        font-size: 3rem
    }
    #walkscore .score-box {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        display: block;
        float: none;
        margin-bottom: 15px
    }
}
#gallery-container #filter-sort, #walkscore, .bubble-icon i {
    text-align: center
}
#gallery .one-third.gallery:hover, #gallery-container #filter-sort span:hover, #specials-wrapper #close-special:hover {
    cursor: pointer
}
#gallery .one-third.gallery, #gallery-container #filter-sort span.active {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
#gallery-container #filter-sort span.active {
    background: #183d4e;
    color: #fff
}
#gallery, #gallery-container #floor-plans, .contact-form {
    padding-top: 40px
}
#gallery .one-third.gallery {
    background: #000;
    width: 32%;
    text-align: center;
    margin-right: .5%;
    margin-left: .5%;
    margin-bottom: 1%;
    -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .18);
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .18)
}
#gallery .sort-item.active {
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}
#gallery .sort-item {
    overflow: hidden;
    position: relative;
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}
#contact-map, #gallery .sort-item, #gallery .sort-item img, #gallery .sort-item.active {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
#gallery .sort-item img {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    display: block;
    text-align: center;
    opacity: .8
}
#contact-container h2 {
    font-size: 2.75rem;
    line-height: 1em;
    padding-bottom: 10px
}
#contact-container h3 {
    color: #777;
    padding-top: 0;
    padding-bottom: 20px
}
#contact-container .contact-wrap h2 {
    padding-top: 0;
    padding-bottom: 10px;
    text-align: center
}
#contact-map {
    width: 100%;
    height: 60vh
}
#contact-container .text-box, #resident-portal {
    padding-bottom: 40px
}
#contact-container h1 {
    padding-bottom: 20px;
    font-size: 2rem
}
#contact-container p.hours {
    font-weight: 600;
    padding-left: 30px;
    font-size: 1.1rem
}
#contact-container .contact-wrap {
    min-height: 450px;
    overflow: hidden
}
.contact-form {
    padding-bottom: 30px
}
#specials-wrapper, .contact-form h3 {
    text-align: center;
    padding-bottom: 30px
}
.contact-form input, .contact-form select {
    font-family: "DINWebPro", serif;
    border: 0;
    color: #999;
    font-size: 1rem;
    font-weight: 500;
    padding: 15px;
    outline: 0;
    margin: 0 auto 20px;
    width: 100%
}
.contact-form .select-title {
    padding-bottom: 5px;
    text-transform: uppercase
}
.contact-form select option {
    padding-top: 5px;
    padding-bottom: 5px
}
.contact-form .submit-button {
    width: 40%;
    margin: 10px auto 0;
    display: block;
    text-align: center;
    background: #183d4e;
    color: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
.contact-form, .contact-form .submit-button:hover {
    background: #ddd
}
.contact-form input#cont-move-date {
    padding: 11px 15px;
    height: 46px
}
.contact-form .one-half, .contact-form input.half-width {
    width: 48%
}
.contact-form span.one-half {
    color: #f5f5f5
}
.contact-form #form-messages {
    padding-bottom: 10px;
    text-align: center;
    font-size: .875em;
    width: 100%
}
a.contact-email {
    font-size: 1.4rem
}
.ref-title {
    display: block;
    font-family: DINWebProCondBold, arial, sans-serif;
    color: #777!important;
    text-align: left
}
#resident-portal .service img {
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    display: block
}
.policy-wrap {
    width: 100%;
    padding-right: 10%;
    padding-left: 10%;
    margin-right: auto;
    margin-left: auto
}
.bubble-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    opacity: .7;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #384144;
    z-index: 999999;
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    -ms-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out
}
.bubble-icon.hidden {
    z-index: -1;
    transform: translateY(-110%);
    -webkit-transition: all 400ms ease-in-out;
    -moz-transition: all 400ms ease-in-out;
    -ms-transition: all 400ms ease-in-out;
    -o-transition: all 400ms ease-in-out;
    transition: all 400ms ease-in-out;
    opacity: 0
}
.bubble-icon i {
    color: #fff;
    width: 50px;
    height: 50px;
    padding: 0;
    margin: 0 auto;
    display: block;
    font-size: 30px;
    line-height: 50px
}
.bubble-icon:hover {
    cursor: pointer;
    color: #5c686e;
    opacity: 1;
    bottom: 25px
}
#specials-wrapper {
    background: #fff;
    position: fixed;
    right: 20px;
    bottom: 12px;
    opacity: 0;
    transition: all .3s;
    -moz-box-shadow: 0 0 70px 0 rgba(0, 0, 0, .2);
    font-family: 'Open Sans', sans-serif;
    z-index: -1;
    visibility: visible;
    width: 410px;
    padding-top: 30px;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .3);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .3)
}
#specials-wrapper.active {
    opacity: 1;
    z-index: 1000000
}
#specials-wrapper #close-special {
    position: absolute;
    top: 5px;
    right: 10px;
    z-index: 10000
}
#specials-wrapper h2 {
    font-size: 2rem;
    line-height: 1.2em;
    padding: 0 15px 8px;
    text-transform: uppercase;
    color: #ff3535
}
#specials-wrapper .button {
    width: 45%;
    font-size: .6755rem;
    margin-left: 5px;
    margin-right: 5px
}
#specials-wrapper p {
    width: 90%;
    margin-right: auto;
    margin-left: auto
}
#footer {
    background: #5b5754;
    padding-top: 40px;
    padding-bottom: 40px;
    color: #fff;
    width: 100%
}
#footer .inner-wrapper {
    max-width: 1080px;
    margin-right: auto;
    margin-left: auto
}
#footer h5 {
    font-size: 1.3rem;
    padding-bottom: .4em
}
#footer a, #footer span {
    color: #fff;
    font-weight: 300
}
#footer .copyright {
    padding-top: 20px;
    border-top: 1px solid #eee
}
#footer .social-block h5 {
    text-align: right
}
#footer .social-icons li {
    display: inline-block;
    margin-left: 5px;
    vertical-align: top
}
#footer .social-icons:first-child li {
    margin-left: 0
}
#footer .social-icons li a {
    font-size: 1.5rem;
    margin-left: 8px
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@-webkit-keyframes slowbounce {
    0% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%)
    }
    to {
        -webkit-transform: translateY(20%);
        transform: translateY(20%)
    }
}
@-o-keyframes slow-bounce {
    0% {
        transform: translateY(0%)
    }
    to {
        transform: translateY(20%)
    }
}
@-ms-keyframes razz-bounce {
    0% {
        transform: translateY(0%)
    }
    to {
        transform: translateY(20%)
    }
}
@keyframes razz-bounce {
    0% {
        transform: translateY(0%)
    }
    to {
        transform: translateY(20%)
    }
}
.slow-bounce {
    -webkit-animation-delay: 0s!important;
    -webkit-animation-direction: alternate!important;
    -webkit-animation-duration: 2s!important;
    -webkit-animation-iteration-count: infinite!important;
    -webkit-animation-name: razz-bounce-2!important;
    -webkit-animation-play-state: running!important;
    -o-animation-delay: 0s!important;
    -o-animation-direction: alternate!important;
    -o-animation-duration: 2s!important;
    -o-animation-iteration-count: infinite!important;
    -o-animation-name: razz-bounce-2!important;
    -o-animation-play-state: running!important;
    animation-delay: 0s!important;
    animation-direction: alternate!important;
    animation-duration: 2s!important;
    animation-iteration-count: infinite!important;
    animation-name: razz-bounce-2!important;
    animation-play-state: running!important
}
.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}
@-webkit-keyframes bounce {
    0%, 20%, 50%, 80%, to {
        transform: translateY(0) translateX(-50%)
    }
    40% {
        transform: translateY(-15px) translateX(-50%)
    }
    60% {
        transform: translateY(-7px) translateX(-50%)
    }
}
@keyframes bounce {
    0%, 20%, 50%, 80%, to {
        transform: translateY(0) translateX(-50%)
    }
    40% {
        transform: translateY(-15px) translateX(-50%)
    }
    60% {
        transform: translateY(-7px) translateX(-50%)
    }
}
.bounce {
    -webkit-animation: bounce 5s infinite;
    animation: bounce 2s infinite
}
.desktop {
    display: block!important
}
.mobile {
    display: none!important
}
span#menu-icon {
    color: #fff;
    display: block;
    position: absolute;
    width: 30px;
    height: 30px;
    top: 15px;
    right: 15px;
    line-height: 1em;
    z-index: 99999;
    text-shadow: 0 1px 2px #636363;
    background-size: 38px 38px;
    background-image: url(../img/menu-icon.png);
    background-position: center center;
    background-repeat: no-repeat
}
#mobile-footer, #mobile-footer.hidden {
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out
}
#mobile-footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    background: #fff;
    -webkit-box-shadow: 0 -3px 4px 0 rgba(0, 0, 0, .18);
    box-shadow: 0 -3px 4px 0 rgba(0, 0, 0, .18);
    border-top: 1px solid #eee;
    height: 42px;
    z-index: 100000000;
    opacity: .9
}
#mobile-footer.hidden {
    opacity: 1;
    z-index: -1;
    height: 0
}
#mobile-footer .mobile-icon {
    width: 40px;
    height: 40px;
    text-align: center;
    float: left
}
#mobile-footer .mobile-icon.right {
    float: right
}
#mobile-footer .mobile-icon i {
    color: #b1b1b1;
    border-right: 1px solid #eee;
    font-size: 30px;
    display: block;
    text-align: center
}
#mobile-footer .mobile-icon.right i {
    border-left: 1px solid #eee;
    border-right: none
}
@media only screen and (max-width:1250px) and (min-width:722px) {
    .hero-slider #hero {
        background: url(../img/hero-bg.jpg) no-repeat center center fixed
    }
    .hero-slider #hero-slider {
        display: none!important
    }
}
@media only screen and (max-width:1110px) and (min-width:722px) {
    #header .nav-container .main-nav li {
        margin-right: .35em;
        margin-left: .35em
    }
    #header .nav-container .main-nav a {
        font-size: 17px!important
    }
}
@media only screen and (max-width:721px) {
    .desktop {
        display: none!important
    }
    .mobile {
        display: block!important
    }
    body, html {
        overflow-x: hidden;
        padding: 0;
        margin: 0
    }
    body {
        top: 0;
        left: 0;
        font-size: 14px;
        max-width: 100%;
        min-width: 100%;
        position: absolute
    }
    html {
        position: relative
    }
    .inner-wrapper {
        padding-right: 0!important;
        padding-left: 0!important
    }
    p.large {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-right: 0;
        padding-left: 0;
        font-size: 1em
    }
    #hero {
        background: url(../img/m-hero-bg.jpg) center center no-repeat!important;
        background-size: cover!important;
        -webkit-background-size: cover!important;
        -moz-background-size: cover!important;
        -ms-background-size: cover!important
    }
    #header #top-apply, #hero-slider {
        display: none!important
    }
    #header, #header.scrolling {
        height: 60px;
        -webkit-box-shadow: 0 3px 7px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 3px 7px 0 rgba(0, 0, 0, .08);
        z-index: 100000;
        top: -2px
    }
    #header .header-content {
        height: 60px
    }
    #header .nav-container, #header .nav-container.active {
        position: fixed;
        top: 0;
        -webkit-transition-duration: .35s;
        transition-duration: .35s;
        min-height: 100%
    }
    #header .nav-container {
        background: rgba(255, 255, 255, .95);
        right: 0;
        margin-top: 0!important;
        display: block;
        padding-left: 15px;
        padding-top: 30px;
        z-index: -1;
        opacity: 0;
        width: 0;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }
    #header .nav-container.active {
        opacity: 1;
        width: 75%;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
        z-indeX: 100000
    }
    #header #logo-container #top-logo {
        position: relative;
        left: 4px;
        width: 180px;
        height: 60px;
        background-size: 153px 39px
    }
    .nav-container #close-main-menu {
        position: absolute;
        color: #444;
        display: block;
        z-index: 1000000;
        top: 10px;
        right: 10px;
        font-size: 20px
    }
    #header .nav-container .main-nav li {
        text-align: left;
        display: block;
        line-height: 3em
    }
    #header .nav-container .main-nav a {
        color: #b1b1b1;
        display: block;
        text-align: left;
        font-size: 28px!important
    }
    #header .nav-container .main-nav a:hover {
        border: 0
    }
    #header .top-marker, #header .top-phone {
        color: #888;
        position: absolute;
        width: 30px;
        height: 30px;
        top: 15px;
        right: 55px;
        line-height: 1em;
        z-index: 99999;
        font-size: 30px
    }
    #header .top-marker {
        right: 85px
    }
    .one-fourth, .one-half, .one-third, .three-fourths, .two-thirds, body, .four-fifths {
        width: 100%
    }

    /*
    #hero-slider {
        max-height: 100vh;
        overflow: hidden;
    }

    #hero-slider img {
        width: auto;
    }
    */

    #home-grid .grid-feat {
        width: 100%;
        float: none;
        padding-bottom: 100%
    }
    #home-grid ul li>a .box-wrap {
        opacity: .8
    }
    #home-grid li>a .box-bg {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1)
    }
    #home-grid li a h2, #home-grid li a h3, #home-grid li a p, #home-grid li a span {
        opacity: .9;
        -webkit-animation: fadeInUp .4s cubic-bezier(.785, .135, .15, .86) .15s forwards;
        -moz-animation: fadeInUp .4s cubic-bezier(.785, .135, .15, .86) .15s forwards;
        animation: fadeInUp .4s cubic-bezier(.785, .135, .15, .86) .15s forwards
    }
    #home-grid li h2 {
        font-size: 1.5rem
    }
    #footer .copyright p, #home-grid li h3 {
        font-size: .875rem
    }
    .callout-box>div {
        padding-right: 10px;
        padding-left: 0
    }
    .callout-box>div p {
        text-align: justify
    }
    .callout-box .callout-button {
        width: 66%
    }
    #slider {
        padding: 0px
        width: 100%;
    }
    #floor-plans-container #filter-sort span {
        background: #fefefe;
        display: inline-block;
        text-align: center;
        padding: 5px 8px;
        margin-left: .2em;
        margin-right: .2em;
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        -ms-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        -webkit-box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .3);
        box-shadow: 0 2px 3px 0 rgba(0, 0, 0, .3);
        font-size: .755rem
    }
    #floor-plans .one-third.sort-item {
        width: 95%;
        margin-right: auto;
        margin-left: auto;
        float: none!important;
        box-shadow: none
    }
    .feature-box {
        border-bottom: none;
        padding-bottom: 0
    }
    .feature-box.first {
        border-top: none
    }
    .feature-box .two-fifths {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        display: block;
        float: none
    }
    .feature-box .three-fifths {
        width: 100%
    }
    .feature-box .feature-text h2 {
        text-align: center;
        padding-bottom: 15px
    }
    .feature-box p {
        text-align: center
    }
    .feature-box ul {
        margin-top: 20px
    }
    #locations-container .one-half {
        width: 50%
    }
    #locations-container .left {
        float: left
    }
    #locations-container .right {
        float: right
    }
    #locations-container .location, #locations-container .location-image {
        height: 45vh
    }
    #locations-container .location-text h2 {
        font-size: 1.1rem;
        padding-top: 30px
    }
    #locations-container .location-text .block-report {
        font-size: 2rem
    }
    #locations-container .location-text .block-report span {
        font-size: .675rem;
        padding-top: 5px;
        margin-bottom: 5px
    }
    #locations-container .location-text .location-website {
        font-size: .5rem
    }
    #gallery-container #filter-sort span {
        padding: 5px 6px;
        margin-left: .25em;
        font-size: .75rem;
        margin-right: .25em
    }
    #gallery .one-third.gallery {
        width: 49%;
        margin-right: .5%;
        margin-left: .5%
    }
    #bottom-callout, .feature-box .three-fifths {
        padding-right: 20px;
        padding-left: 20px
    }
    #specials-wrapper {
        width: 100%;
        z-index: 1000000000;
        right: 0;
        bottom: 0;
        padding-top: 0;
        padding-bottom: 0;
        max-height: 0
    }
    #specials-wrapper h2 {
        padding-bottom: 20px
    }
    #specials-wrapper .button {
        font-size: .575rem;
        padding-top: .5em;
        padding-bottom: .5em
    }
    #specials-wrapper.active {
        padding-top: 30px;
        padding-bottom: 60px;
        max-height: 100000px
    }
    #specials-wrapper p {
        width: 85%
    }
    #specials-wrapper #request-button {
        width: 75%;
        font-size: 1rem;
        margin-right: auto;
        margin-left: auto;
        float: none
    }
    #footer .inner-wrapper {
        max-width: 100%
    }
    #footer .information {
        text-align: center;
        padding-right: 10px;
        padding-left: 10px
    }
    #footer .social-block {
        width: 100%;
        text-align: center
    }
    #footer .social-block h5 {
        float: none;
        text-align: center
    }
    #footer .copyright {
        padding-right: 10px;
        padding-left: 10px
    }
}


/* Remove the chat button from the script 
---------------------------------------------*/

#cta-button {
	display: none !important;
}

/* Additional Styles for Test */

/* Home Staggered Grid Layout */
#home-stagard-promo {
width:100%;
padding-left:40px;
padding-right:40px;
}

#home-stagard-promo .home-promo {
width:100%;
position:relative;
opacity:.7;
-webkit-transition:all 300ms ease-in-out;
-moz-transition:all 300ms ease-in-out;
-ms-transition:all 300ms ease-in-out;
-o-transition:all 300ms ease-in-out;
transition:all 300ms ease-in-out;
}

#home-stagard-promo .home-promo:hover {
opacity:1;
-webkit-transition:all 300ms ease-in-out;
-moz-transition:all 300ms ease-in-out;
-ms-transition:all 300ms ease-in-out;
-o-transition:all 300ms ease-in-out;
transition:all 300ms ease-in-out;
}

#home-stagard-promo .home-promo .box-wrap {
text-align:center;
padding:5.5% 80px 0;
}

#home-stagard-promo .box-bg {
height:370px;
position:relative;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-ms-background-size:cover;
}

#home-stagard-promo .tag {
opacity:.97;
width:200px;
position:absolute;
top:50%;
transform:translateY(-50%);
display:inline-block;
cursor:pointer;
font-size:.675rem;
margin-bottom:0;
text-transform:uppercase;
letter-spacing:.18em;
outline:0;
text-align:center;
border:1px solid transparent;
-webkit-transition:all 300ms ease-in-out;
-moz-transition:all 300ms ease-in-out;
-ms-transition:all 300ms ease-in-out;
-o-transition:all 300ms ease-in-out;
transition:all 300ms ease-in-out;
padding:20px 15px;
}

#home-stagard-promo .left .tag {
right:0;
}

#home-stagard-promo .right .tag {
left:0;
}

#home-stagard-promo .home-promo h5 {
font-family:DINWebProMedium, arial, sans-serif;
font-size:12px;
margin-bottom:10px;
text-transform:uppercase;
font-weight:600;
letter-spacing:.18em;
line-height:1em;
}

#home-stagard-promo .home-promo h2 {
padding-top:0;
padding-bottom:20px;
font-size:3rem;
line-height:1em;
}