/* @group Commercial
------------------------------------ */
.page-header .img-box { height: 38.1rem; }
.page-header h1 { font-size: 4.8em; font-weight: 800; letter-spacing: 0.24px; line-height: 1.209em; }
.commercial-main { background: linear-gradient(to bottom, rgba(237,248,251,1) 27.9rem, rgba(255,255,255,1) 27.9rem); }
/* Main Header
----------------------*/
.commercial-main header { padding:  7.6rem 0 6.8rem; margin-bottom: 8.7rem; }
.commercial-main header h2 { color: rgba(26,46,87,1); font-size: 3.6em; font-weight: 800; margin: 0 0 2rem; }
.commercial-main header p { color: rgba(26,46,87,1); font-size: 1.6em; letter-spacing: 0.77px; line-height: 1.929em; }
.commercial-main header p:last-child { margin: 0 auto; }
/* Main Section
----------------------*/
.commercial-main section { margin-bottom: 10.6rem; }
.commercial-main section .img-box { height: 58.2rem; }
.commercial-main section h2 { color: rgba(26,46,87,1); font-size: 3.6em; font-weight: 800; line-height: 1.5em; margin: 0 0 2rem; }
.commercial-main section h3 { color: rgba(21,45,90,1); font-size: 2.4em; font-weight: 800; }
.commercial-main section h4 { color: rgba(21,45,90,1); font-size: 1.4em; line-height: 2.575em; }
.commercial-main section p,
.commercial-main section li { color: rgba(0,100,167,1); font-size: 1.6em; letter-spacing: 0.77px; line-height: 2.575em; }
.commercial-main section li a { color: rgba(0,100,167,1); }
.commercial-main section ul:not(.contact),
.commercial-main section ol:not(.contact),
.commercial-main section p { margin: 0 0 4.2rem; }
.commercial-main section p:empty { display: none; }
.commercial-main section p.contact-name { margin: 1rem 0 0; }
.commercial-main section h4 + ul:not(.contact),
.commercial-main section h4 + ol:not(.contact),
.commercial-main section h4 + p { margin: 0 0 2.1rem; }
.commercial-main section ol:not(.contact) li { list-style: decimal outside none; }
.commercial-main section ul:not(.contact) li { text-indent: -.7em; padding-right: .7em; }
.commercial-main section ul:not(.contact) li::before { content: '•'; padding-right: .7em; }
.commercial-main section ol:last-child,
.commercial-main section ul:last-child,
.commercial-main section p:last-child { margin: 0; }
.commercial-main section .bttn-container { margin: 0 0 5rem; }
.commercial-main section .bttn-container:last-child { margin: 0; }
.commercial-main section .contact-name { margin-top: 1em !important; margin-bottom: 0 !important; }

.commercial-main section .contact li { letter-spacing: 0.3px; position: relative; }
.commercial-main .contact li i { color: rgba(0,178,221,1); font-size: 1.143em; position: absolute; left: -2.1rem; margin-top: 1rem; }
.commercial-main .contact li .icon-Artboard-Copy-27 { font-size: 1.429em; left: -2.9rem; margin-top: .65rem; }
/* Main Map
----------------------*/
.commercial-map { margin-bottom: 9rem; }
.commercial-map .mapContainer { height: calc(100vh - 8.8rem); background: rgba(242,242,235,1); display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; }
.commercial-map .mapContainer img { height: auto; width: auto; max-width: 100%; max-height: 100%; }
@media only screen
and (min-width : 961px) {
  /* Main Header
  ----------------------*/
  .commercial-main header p { max-width: 80rem; margin: 0 auto 2rem; }
  .commercial-main header h2,
  .commercial-main header p { opacity: 0; visibility: hidden; }
  .commercial-main.animateActive header h2,
  .commercial-main.animateActive header p { animation: textUp .5s 1 cubic-bezier(0.4,0.0,0.2,1) forwards; }
  .commercial-main.animateActive header p { animation-delay: .4s; }
  /* Main Section
  ----------------------*/
  .commercial-main section .bttn { padding: 2.5rem 4.75rem; }
  .commercial-main section .contact { display: flex; flex-wrap: wrap; }
  .commercial-main section .contact li { display: inline-block; margin-right: 6rem; }
  .commercial-main section .contact li:last-child { margin-right: 0; }
  .commercial-main section .img-box,
  .commercial-main section h2,
  .commercial-main section h3,
  .commercial-main section h4,
  .commercial-main section p,
  .commercial-main section li,
  .commercial-main section .bttn-container { opacity: 0; visibility: hidden; }
  .commercial-main section.animateActive .img-box,
  .commercial-main section.animateActive h2,
  .commercial-main section.animateActive h3,
  .commercial-main section.animateActive h4,
  .commercial-main section.animateActive p,
  .commercial-main section.animateActive li,
  .commercial-main section.animateActive .bttn-container { animation: textUp .5s 1 cubic-bezier(0.4,0.0,0.2,1) forwards; }
  .commercial-main section.animateActive h2 { animation-delay: .4s; }
  .commercial-main section.animateActive h3 { animation-delay: .6s; }
  .commercial-main section.animateActive h4 { animation-delay: .6s; }
  .commercial-main section.animateActive p { animation-delay: .6s; }
  .commercial-main section.animateActive li { animation-delay: .8s; }
  .commercial-main section.animateActive .bttn-container { animation-delay: 1s; }
  /* Main Map
  ----------------------*/
  .commercial-map .mapContainer { min-height: 770px; }
  /* Main Retail
  ----------------------*/
  .commercial-main .retail h2 { margin-top: 5.3rem; }
  .commercial-main .retail .img-box { margin: 0 0 5.4rem; }
  .commercial-main .retail aside h3,
  .commercial-main .retail aside .contact { margin-left: 2.1rem; }
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
  .page-header .img-box { height: 37.8rem; }
  .page-header h1 { font-size: 6em; letter-spacing: 0.31px; line-height: 1.217em; }
  .commercial-main { background: none; }
  /* Main Header
  ----------------------*/
  .commercial-main header { background: rgba(237,248,251,1); padding:  7.8rem 0 6.7rem; margin-bottom: 6rem; }
  .commercial-main header h2 { font-size: 5em; letter-spacing: 1.07px; line-height: 1.040em; margin: 0 0 1.7rem; }
  .commercial-main header p { font-size: 2.6em; letter-spacing: 0.56px; line-height: 1.694em; }
  /* Main Section
  ----------------------*/
  .commercial-main section { margin-bottom: 7.2rem; }
  .commercial-main section .img-box { height: 62.1rem; }
  .commercial-main section h2 { font-size: 5em; letter-spacing: 1.07px; line-height: 1.040em; margin: 0 0 1.6rem; }
  .commercial-main section h3 { font-size: 2.6em; letter-spacing: 0.77px; line-height: 1.848em; }
  .commercial-main section h4 { font-size: 2.6em; line-height: 1.694em; }
  .commercial-main section p,
  .commercial-main section li { font-size: 2.6em; letter-spacing: 0.56px; line-height: 1.694em; }
  .commercial-main section ul:not(.contact),
  .commercial-main section ol:not(.contact),
  .commercial-main section p { margin: 0 0 5.7rem; }
  .commercial-main section h4 + ul:not(.contact),
  .commercial-main section h4 + ol:not(.contact),
  .commercial-main section h4 + p { margin: 0 0 3rem; }
  .commercial-main section .bttn { margin: 0 0 8.1rem; }
  .commercial-main section .contact li { letter-spacing: 0.77px; line-height: 1.848em; display: inline-block; margin-right: 10.3rem; }
  .commercial-main section .contact li:last-child { margin-right: 0; }
  .commercial-main .contact li i { font-size: .962em; left: -3.5rem; margin-top: 1.2rem; }
  .commercial-main .contact li .icon-Artboard-Copy-27 { font-size: 1.077em; left: -3.7rem; margin-top: 1rem; }
  /* Main Retail
  ----------------------*/
  .commercial-main .retail { margin-bottom: 12rem; }
  .commercial-main .retail .bttn-container { margin-bottom: 6rem; }
  .commercial-main .retail .bttn:last-child { margin-bottom: 0; }
  .commercial-main .retail aside { display: flex; flex-direction: column; }
  .commercial-main .retail .img-box { order: 4; margin: 0 0 6rem; }
  .commercial-main .retail article { padding-left: 10rem; }
  .commercial-main .retail .contact { margin: 0; }
  .commercial-main .retail .contact li { margin-right: 7.3rem; }
  /* Land Sales
  ----------------------*/
  .commercial-main .land-sales { margin: 0 0 10.8rem; }
  .commercial-main .land-sales .contact { margin: 0 0 7.9rem; }
  /* Main Map
  ----------------------*/
  .commercial-map { margin-bottom: 9.3rem; }
  .commercial-map .mapContainer { height: auto; }
  .commercial-map .mapContainer img { width: 100%; }
}
/* @end */
