.top-banner {
	background: #3e97b5 url(/wp-content/uploads/2025/08/North-River-Ranch-banner-2.webp) no-repeat;
	background-position: center;
    background-size: cover;
	height: 30rem;
}
.top-banner p {
	font: 500 1.375rem/1.875rem "Roboto", sans-serif;
	color: #fff;
}
.top-banner span.grand-opening {
	display: block;
	font: 300 5.125rem/6.25rem "Roboto", sans-serif;
	color: #3f96b5;
	padding-top: 0.9375rem;
	padding-bottom: 0.9375rem;
}
.top-banner span.coming-soon {
	display: block;
	font: 500 1.875rem/2.5rem "Roboto", sans-serif;
	color: #fff;
}
.top-banner .round-button {
	background-color: #A85E1A;
	color: #fff;
	font: 700 0.875rem/1.1875rem "Roboto";
	padding: 0.625rem;
	width: 9.375rem;
}
.register p, .bottom-register p {
	font: 400 1.375rem/1.875rem "Roboto";
	color: #707070;
}
.register .round-button {
	background-color: #A85E1A;
	color: #fff;
	font: 500 1.5rem/1.5rem "Roboto";
	width: 12.5rem;
	padding: 0.8125rem;
	border-radius: 0;
	margin-bottom: 1.875rem;
	margin-top: 3.125rem;
}
.bottom-register .round-button, .five-star-living .round-button, .featured-homes .round-button {
	color: #fff;
	font: 500 1.5rem/1.5625rem "Roboto";
	padding: 0.9375rem;
	margin-bottom: 1.25rem;
}
.featured-homes .round-button {
	width: 17.5rem;
	background-color: #000;
}
.five-star-living .round-button {
	width: 20.625rem;
	background-color: #A85E1A;
	margin-top: 2.5rem;
}
.bottom-register .round-button {
	width: 12.5rem;
	background-color: #A85E1A;
	margin-top: 1.875rem;
}
.intro {
	background: url(/wp-content/uploads/2026/02/nrrbg_01.webp) no-repeat;
	background-position: center;
	padding-bottom: 1.875rem;
}
.intro h1 {
	font: 500 2.5rem/3.125rem "Roboto";
	color: #3e97b5;
	margin-bottom: 0.9375rem;
	margin-top: 0.9375rem;
}
.intro p {
	font: 400 1.375rem/2.3125rem "Roboto";
	color: #707070;
	padding-top: 6.25rem;
}
.intro .tree {
	position: relative;
  	width: 7.25rem;
}
.intro .award {
	position: absolute;
	right: 1.25rem;
	top: -1.25rem;
}
.video-thumb {
	margin-top: 5rem;
}
.five-star-living {
	background: url(/wp-content/uploads/2026/02/nrrbg_02-scaled.webp) no-repeat;
	background-position: center;
	padding-top: 1.875rem;
}
.featured-homes {
	background: #f7f7f7 url('/wp-content/uploads/2026/02/nrrbg-blue-puddle.svg') no-repeat;
	background-position: right bottom;
	padding-top: 1.875rem;
	padding-bottom: 3.125rem;
}
.five-star-living h2, .featured-homes h2 {
	font: 500 2.5rem/3.125rem "Roboto";
	color: #3e97b5;
	margin-bottom: 0.9375rem;
}
.featured-homes h3 {
	font: 500 1.375rem/2rem "Roboto";
	color: #484747;
}
.five-star-living p {
	font: 400 1.375rem/1.875rem "Roboto";
	color: #707070;
}
.featured-homes p {
	font: 400 1.25rem/1.875rem "Roboto";
	color: #707070;
	padding-right: 1.25rem;
}
.featured-homes p.bold {
	font-weight: 700;
	color: #535252;
	padding-right: 0;
}
.crescent-creek h2 {
	color: #f19b3b;
}
.riverfield h2 {
	color: #9b9264;
}
.longmeadow h2 {
	color: #3e97b5;
}
.crescent-creek, .longmeadow, .riverfield {
	padding-bottom: 2.5rem;
}
.gallerySwiper2 {
	padding-top: 1.875rem;
}
.gallerySwiper1 .swiper-slide{
	height: 34.125rem;
}
.swiper-slide {
	height: 31.25rem;
}
.swiper-slide .slide-caption {
	text-align: center;
	margin-top: -1.875rem;
  	color: #fff;
  	font-weight: 500;
}
.gallerySwiper3 .swiper-slide {
	height: 18.75rem;
}
.swiper-button-next, .swiper-button-prev {
    color: #fff !important;
}
ul.amenities {
    list-style: none;
	margin-bottom: 0;
}
ul.amenities li {
	font: 400 1.125rem/2rem "Roboto";
	color: #707070;
	text-transform: uppercase
}
ul.amenities li::before {
  content: "\2022";
  color: #3E97B5;
  font-weight: bold;
  display: inline-block;
  width: 1em;
  margin-left: -1em;
  font-size: 1.5625rem;
}
.amenity-icons {
	margin-bottom: 1.875rem;
}
.amenity-icons img {
	height: 3.125rem;
}
.yellow-puddle-bg {
	background: url(/wp-content/uploads/2026/02/nrrbg_03-scaled.webp) no-repeat;
	background-position: bottom;
}
section.beach {
	margin-top: 2.5rem;
}
section.beach .fun-in-the-sun {
	background: #3e97b5 url(/wp-content/uploads/2026/02/beach-bg.webp) no-repeat;
	background-position: center;
    background-size: cover;
	height: 31.25rem;
}
section.beach .fun-in-the-sun h2 {
	font: 500 2.5rem/3.125rem "Roboto";
	color: #fff;
	margin-bottom: 0.9375rem;
}
section.beach p {
	font: 400 1.375rem/2.3125rem "Roboto";
	color: #707070;
}
section.beach .white-container {
	background-color: #f7f7f7;
	margin-top: -8.4375rem;
	margin-bottom: 3.125rem;
	border: 1px solid rgba(121, 121, 121, .4);
}
section.beach .white-container p {
	padding: 1.875rem 2.625rem;
}
section.beach ul {
	list-style: none;
	margin-bottom: 0;
}
section.beach ul li {
	font: 400 1.25rem/2.3125rem "Roboto";
	color: #707070;
}

.location {
	padding-bottom: 6.25rem;
  	margin-top: 3.125rem;
	background: url(/wp-content/uploads/2026/02/nrrbg_04-scaled.webp) no-repeat;
	background-position: top;
}
.location .map {
	background: url(/wp-content/uploads/2025/08/North-River-Ranch-Map.webp);
	background-size: cover;
	height: 44.25rem;
}
.location .map .round-button {
	background-color: #3E97B5;
	color: #fff;
	font: 500 1.25rem/1.125rem "Roboto";
	width: 13.875rem;
	padding: 0.625rem;
	border-radius: 0;
	border: 1px solid #fff;
	margin-top: 19.375rem;
}
.location .ideally-located {
	padding-left: 1.875rem;
}
.location h2  {
	font: 500 2.5rem/3.3125rem "Roboto";
	color: #3E97B5;
}
.location p {
	font: 400 1.375rem/2.125rem "Roboto";
	color: #707070;
}
ul.legend {
	margin-top: 1.875rem;
	padding-left: 0;
}
ul.legend li {
	font: 400 1.3125rem/1.875rem "Roboto";
	color: #707070;
	list-style-type: none;
}
ul.legend li strong {
	font-weight: 500;
}
ul.legend .number {
	width: 2.125rem;
	border-radius: 50%;
	color: #fff;
	font: 400 1.25rem/1.25rem "Roboto";
	display: inline-block;
	text-align: center;
	padding: 0.3125rem;
	margin-right: 0.625rem;
	margin-bottom: 0.625rem;
	border: 2px solid #fff;
}
ul.legend .number.one {
	background-color: #FF9B2E;
}
ul.legend .number.two {
	background-color: #3E6883;
}
ul.legend .number.three {
	background-color: #677558;
}
ul.legend .number.four {
	background-color: #BA2C12;
}
ul.legend .number.five {
	background-color: #76BFA6;
}
ul.legend .number.six {
	background-color: #3E6883;
}
ul.legend .number.seven {
	background-color: #878E80;
}
ul.legend .number.eight {
	background-color: #73628B;
}
ul.legend .number.nine {
	background-color: #F6E26E;
}
ul.legend .number.ten {
	background-color: #729AB9;
}
ul.legend .number.eleven {
	background-color: #743441;
}
.perfectly-personalized {
	padding-top: 3.125rem;
	padding-bottom: 10.625rem;
	background: #3E97B5 url(/wp-content/uploads/2025/08/nrrbg_05.webp);
	background-size: cover;
}
.perfectly-personalized .tree {
	position: absolute;
	right: 8.4375rem;
}
.perfectly-personalized h2 {
	font: 500 2.3125rem/3.0625rem "Roboto";
	color: #fff;
	padding-bottom: 1.25rem;
	text-align: center;
}
.perfectly-personalized p {
	font: 400 1.375rem/2.125rem "Roboto";
	color: #fff;
	text-align: center;
}
.bottom-register {
	margin-top: -10.625rem;
}
.bottom-register .color-palette {
	border: 5px solid #fff;
	background: url(/wp-content/uploads/2025/08/Color-palette-NRR.webp);
	background-size: cover;
	height: 17.625rem;
	margin-bottom: 1.5625rem;
}
.bottom-register .color-palette .round-button {
	background-color: #3E97B5;
	width: 16.5625rem;
  	margin-top: 11.25rem;
}
#video-link-modal .modal-dialog {
  	max-width: 70%;
}
#video .modal-body {
	padding: 0;
}
#video .modal-content .close {
	z-index: 99;
}
@media (max-width: 991px) {
	.top-banner span.grand-opening {
		font: 300 2.5rem/3.125rem "Roboto", sans-serif;
		padding-bottom: 0.3125rem;
	}
	.top-banner span.coming-soon {
		font: 700 1.25rem/1.5625rem "Roboto", sans-serif;
	}
	.top-banner {
		height: 18.75rem;
	}
	.top-banner img {
		padding: 1.875rem 0 0;
		width: 15rem;
	}
	.intro, .five-star-living, .yellow-puddle-bg, .location {
		background: none;
	}
	.intro {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}
	.intro p {
		padding-top: 1.25rem;
	}
	.intro h1 {
		text-align: center;
	}
	.intro h1, .five-star-living h2, .featured-homes h2, .location h2, section.beach .fun-in-the-sun h2, .perfectly-personalized h2 {
		font: 500 1.875rem/2.5rem "Roboto";
	}
	.intro p, .five-star-living p, .featured-homes p, .location p {
		font: 400 1.125rem/1.75rem "Roboto";
	}
	.featured-homes {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}
	.featured-homes p {
		padding-right: 0;
	}
	.featured-homes p.bold {
		padding-bottom: 0;
	}
	.featured-homes h3 {
		font: 500 1.25rem/1.75rem "Roboto";
	}
	.crescent-creek, .longmeadow, .riverfield {
		padding-bottom: 1.25rem;
	}
	.location {
	  	padding-top: 1.25rem;
	  	padding-bottom: 1.25rem;
	  	margin-top: 0;
	}
	.location .ideally-located {
		padding-left: 0.9375rem;
	}
	.location h2 {
		padding-top: 1.25rem;
	}
	ul.legend li {
	  	font: 400 1.125rem/1.375rem "Roboto";
	}
	ul.legend .number {
		font-size: 1.125rem;
		margin-right: 0.3125rem;
	}
	ul.amenities li {
		font: 400 1rem/1.5625rem "Roboto";
	}
	section.beach {
	  	margin-top: 1.25rem;
	}
	section.beach ul {
		margin-top: 1.25rem;
	}
	section.beach p {
		font: 400 1.25rem/1.875rem "Roboto";
	}
	section.beach ul li {
	  font: 400 1.25rem/1.875rem "Roboto";
	}
	section.beach .white-container {
		margin-top: -11.25rem;
		margin-bottom: 1.25rem;
	}
	section.beach .white-container p {
		padding: 1.25rem 0.625rem;
	}
	section.beach .fun-in-the-sun {
		height: 25rem;
	}
	.amenity-icons img {
		height: 2.5rem;
	}
	.featured-homes img {
		padding-bottom: 0.9375rem;
	}
	.register .round-button, .bottom-register .round-button, .bottom-register .color-palette .round-button, .five-star-living .round-button, .featured-homes .round-button {
		font: 500 1.25rem/1.375rem "Roboto";
	}
	.bottom-register .round-button {
		margin-top: 1.25rem;
	}
	.featured-homes .round-button {
		margin-bottom: 2.5rem;
		width: 15.625rem;
	}
	.five-star-living .round-button {
		width: 17.8125rem;
  		margin-top: 1.875rem;
	}
	.register p, .bottom-register p {
		font: 400 1.25rem/1.75rem "Roboto";
	}
	.perfectly-personalized .tree {
		right: 0;
		top: -5.625rem;
		width: 9.375rem;
	}
	.perfectly-personalized p {
		font: 400 1.25rem/1.875rem "Roboto";
	}
	.swiper-slide {
		height: 21.25rem;
	}
	.gallerySwiper2 {
		padding-top: 0;
		padding-bottom: 2.5rem;
	}
}
@media (max-width: 600px) {
	.top-banner span.coming-soon {
		font: 700 1rem/1.375rem "Roboto", sans-serif;
	}
	.intro .tree {
		width: 6.25rem;
	}
	.location .map {
		height: 35.9375rem;
	}
	.location .map .round-button {
		margin-top: 15.125rem;
	}
	.amenity-icons img {
		height: 2rem;
	}
	.swiper-slide {
		height: 13.75rem;
	}
	.gallerySwiper2 {
		padding-top: 0;
		padding-bottom: 0.9375rem;
	}
}

.max-width-container {
	max-width: 93.75rem;
	margin: 0 auto;
}
.promo {
	background: #f7f7f7;
}
.promo .white-box {
	background: #fff;
	padding: 0.9375rem 0.625rem;
	margin-top: 0.9375rem;
	margin-bottom: 0.9375rem;
	min-height: 8.4375rem;
}
.promo h2 {
	font: 500 1.25rem/1.563rem "Roboto";
	color: #005683;
}
.promo h3 {
	color: #333;
	font: 500 1.438rem/1.75rem "Roboto";
	margin-bottom: 0;
}
.promo p.disclaimer {
	font: 400 0.75rem/1rem 'Roboto', sans-serif;
	color: #666;
}
.promo .community-link-btn {
  background-color: #333;
  color: #fff;
  font: 700 1.125rem/1.375rem 'Roboto', sans-serif;
  text-transform: uppercase;
  border-radius: 0.3125rem;
  width: 15rem;
  padding: 0.625rem;
  height: auto;
  border: 0;
}
#promo-modal .modal-dialog {
    max-width: 43.75rem !important;
}
#promo-modal .modal-body {
    background: #fff url(/wp-content/uploads/2025/08/promos-fg-banner.webp) center center;
    padding: 0;
    background-repeat: no-repeat;
    background-size: contain;
	background-position: top center;
}
#promo-modal h2 {
 	font: 500 2.125rem/2.1875rem 'Roboto', serif;
 	color: #333;
 	text-align: center;
	letter-spacing: 0;
	padding-top: 0.625rem;
	padding-bottom: 0.625rem;
}
#promo-modal h3 {
  text-transform: none;
  font: 500 1.375rem/1.625rem 'Roboto', serif;
  color: #333;
  text-align: center;
}
#promo-modal h4 {
  text-transform: none;
  font: 500 1.375rem/1.625rem 'Roboto', serif;
  color: #333;
  text-align: center;
}
#promo-modal h5 {
	font: 400 0.9375rem/1.375rem 'Roboto', serif;
	padding: 0.9375rem 0.625rem 0;
	color: #666;
	margin: 0;
}
.whitebox {
  background-color: #fff;
  padding: 1.25rem;
  margin-top: 20rem;
  margin-bottom: 0;
}
.whitebox a.round-button {
	width: 10.625rem;
	background: none;
	border: 1px solid;
}
.modal-content .close {
	color: #333;
	z-index: 99;
}
#promo-modal .modal-content {
	border-radius: 0;
}
#promo-modal .modal-body img {
	padding: 3.125rem;
}

@media (max-width: 768px) {
	.promo-container {
		padding: 0;
	}
	#promo-modal.modal {
		left: -0.75rem !important;
	}
	#promo-modal .modal-dialog {
		max-width: 22.5rem !important;
	}
	#promo-modal h2 {
		font: 700 1.5625rem/1.75rem 'Roboto', serif;
	}
	#promo-modal h3 {
		font: 500 1.125rem/1.375rem 'Roboto', serif;
	}
	#promo-modal h4 {
    	font: 500 1.125rem/1.375rem 'Roboto', serif;
	}
	#promo-modal h5 {
		font: 400 0.875rem/1.125rem 'Roboto', serif;
		padding: 0.625rem 0;
	}
	.whitebox {
		margin-top: 11.25rem;
	}
	.modal-content .close {
		top: -0.3125rem;
		right: -0.3125rem;
	}
}


/** CTA CSS */
.quick-comm {
    background-color: #fff;
    padding: 1.875rem 0;
}
.quick-comm__header {
    font-size: 1.125rem;
    font-weight: 700;
}
.quick-comm__location-icon {
    color: #dc3545;
    font-size: 1.5rem;
}
.quick-comm__location-info {
    font-size: 1rem;
}
.quick-comm__location-info span {
    color: #B2292D;
    font-size: 1rem;
    margin-bottom: 0;
    font-weight: 500;
    display: block;
}
.quick-comm__location-info a {
    margin-bottom: 0;
    color: inherit;
    text-decoration: underline;
}
.quick-comm__location-info p {
    margin-bottom: 0;
	font-weight:500;
}
.quick-comm__btn {
    border-width: 1px;
    font-weight: 500;
    border-radius: 0.3125rem;
    height: 2.6875rem;
    line-height: 2.6875rem;
    padding: 0;
    border: solid 1px #707070;
    color: #000;
    text-align: center;
    transition: background-color 0.3s ease, color 0.3s ease;
}
.quick-comm__btn.register {
	color: #FFF;
  	background-color: #B2292D;
  	display: block;
}
.quick-comm__btn.register:hover {
    color: #FFF;
    text-decoration: none;
    background-color: #B2292D;
}
.quick-comm__btn.question:hover {
    color: #FFF;
    text-decoration: none;
    background-color: #333;
}
@media (max-width: 768px) {
.quick-comm__header {
    font-size: 0.9375rem;
}
.quick-comm__location-info, .quick-comm__location-info span, .quick-comm__location-info p {
    font-size: 0.875rem;
}
}

/** Start Spotlight Event **/

.modal-dialog {
    max-width: 43.75rem;
}
.modal-body {
    position: relative;
    padding: 0;
}
.custom-close {
    position: absolute;
    top: 0.875rem;
    right: 1.25rem;
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.custom-close span {
    font-size: 3.125rem;
    line-height: 1;
}
@media (max-width: 768px) {
.custom-close {
    top: 0.3125rem;
    right: 0.625rem;
}
.custom-close span {
    font-size: 1.875rem;
}
}



/* Start springPromoEvent */

#promoEvent .modal-dialog {
    max-width: 37.5rem;
}
#promoEvent .modal-body {
    position: relative;
    padding: 0;
}
#promoEvent .custom-close {
    position: absolute;
    top: 0.875rem;
    right: 1.25rem;
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
	color: #333;
}
#promoEvent .custom-close span {
    font-size: 3.125rem;
    line-height: 1;
}
@media (max-width: 991px) {
#promoEvent .modal-dialog {
    max-width: 21.875rem;
}
}