.top-banner {
	background: #000 url(/wp-content/uploads/2026/03/Seaflower-banner-bg.webp) no-repeat;
    background-size: cover;
	background-position: center;
	height: 480px;
}
.top-banner img.logo {
	margin-top: 60px;
	margin-bottom: 30px;
	border-bottom: 1px solid #fff;
	padding-bottom: 40px;
}
.top-banner span.coming-soon {
	display: block;
	font: 700 34px/37px "Roboto";
	color: #fff;
}
.top-banner h1 {
	font: 500 30px/37px "Roboto";
	color: #fff;
}
.intro-1 {
	background: #fff;
  	margin-top: 20px;
}
.leaf-bg {
	background: #fff url('/wp-content/uploads/2025/09/leaf-1.svg') no-repeat;
	background-size: 35%;
  	background-position: 10%;
}
.intro-2 {
	margin-top: -125px; 
}
.intro-1 h2 {
	font: 300 50px/50px "Roboto";
	color: #666f6c;
	margin-bottom: 0;
}
.intro-1 img.video-preview {
	right: -25px;
 	position: relative;
}
.connected-by-water h2{
	font: 300 50px/55px "Roboto";
	color: #666f6c;
}
.intro-2 p, .connected-by-water p {
	font: 400 20px/34px "Roboto";
	color: #707070;
}
.register { 
	padding-top: 30px;
	padding-bottom: 40px;
}
.register p {
	font: 500 28px/35px "Roboto";
	color: #df6d5d;
}
.register p a {
	color: #df6d5d;
}
.register .round-button {
	background-color: #df6d5d;
	border-radius: 0 !important;
	width: 200px;
	color: #fff;
	font: 500 24px/32px "Roboto";
}
.connected-by-water {
	background: #e8f3f5 url('/wp-content/uploads/2025/09/leaf-3.svg') no-repeat;
	background-size: contain;
	background-position: 50px;
	padding: 40px 0;
}
.amenityCarousel img {
	border: 10px solid #fff;	
}
.garden-club {
	padding: 30px 0;
}
.garden-club h3 {
	font: 500 34px/35px "Roboto";
	color: #969d61;	
}
.garden-club  ul {
	list-style-type: disc;
	margin-bottom: 0;
	padding-left: 20px;
}
.garden-club  ul li {
	font: 400 20px/34px "Roboto";
	color: #656f6d;
}
.green-banner {
	background-color: #969d61;
	padding: 20px 0;
}
.green-banner h3 {
	font: 500 33px/48px "Roboto";
	color: #fff;
	margin-bottom: 0;
}
.green-banner img.flower{
	margin-top: -40px;
	margin-right: 25px;	
}
.location-1 {
	padding: 40px 0;
	background-color: #f9f9f9;
}
.location-2 {
	padding: 40px 0;
	background: #fff url('/wp-content/uploads/2025/09/leaf-5.svg') no-repeat;
	margin-top: -100px;
	background-size: contain;
	background-position: left;
}
.location-1 p, .location-2 p {
	font: 400 20px/34px "Roboto";
	color: #707070;
}
.location-1 img.leaf {
	height: 450px;
	margin-top: -150px;
	right: -50px;
	position: relative;
}
.location-2 h2 {
	font: 300 50px/55px "Roboto";
	color: #666f6c;
}
.location-3 h3 {
	font: 500 27px/34px "Roboto";
	color: #4f8591;
	padding-left: 25px;
}
.location-3 ul {
	font: 400 19px/32px "Roboto";
	color: #707070;
	list-style: none;
	padding-left: 25px;
	margin-bottom: 0;
}
.location-3 ul strong {
	font-weight: 500;
}
.location-3 img.icon {
	height: 100px;
}
.grey-bg {
	background-color: #f9f9f9;
	padding: 30px 0;
}
.white-bg {
	background-color: #fff;
	padding: 30px 0;
}
.red-divider {
	border-right: 1px solid #df6d5d;
}

.perfectly-personalized {
	padding-top: 40px;
	padding-bottom: 170px;
	background: #daa73d;
}
.perfectly-personalized .flower {
	position: relative;
  	right: 90px;
  	top: -90px;
  	float: right;
}
.perfectly-personalized h2 {
	font: 500 37px/49px "Roboto";
	color: #fff;
	padding-bottom: 20px;
	margin-bottom: 0;
	text-align: center;
}
.perfectly-personalized p {
	font: 400 22px/34px "Roboto";
	color: #fff;
	text-align: center;
}
.bottom-register {
	margin-top: -170px;	
	background: #75aaba url('/wp-content/uploads/2026/03/blue-bg.webp') repeat;
}
.bottom-register .round-button {
	background-color: #fff;
	color: #75aaba;
	font: 500 22px/24px "Roboto";
	width: 200px;
	padding: 13px;
	border-radius: 0 !important;
	margin-bottom: 20px;
	margin-top: 40px;
}
.bottom-register .color-palette .round-button {
	color: #fff;
}
.bottom-register .color-palette {
	border: 5px solid #fff;
	background: url(/wp-content/uploads/2026/03/color-pallete-Seaflower.webp);
	background-size: cover;
	height: 282px;
}
.bottom-register p {
	font: 500 22px/30px "Roboto";
	color: #fff;
}
.bottom-register .color-palette .round-button {
	background-color: #3E97B5;
	width: 250px;
	margin-top: 130px;
}

.modal-content {
	border: 0 !important;	
}
.modal-content .close {
	z-index: 999;	
}
#video-link-modal .modal-dialog {
  max-width: 70%;
}

	
@media (max-width: 1500px) {
	.intro-2 {
		margin-top: -80px;
	}
}
	
@media (max-width: 991px) {
.top-banner {
	height: 300px;
}
.top-banner img.logo {
	margin-top: 25px;
    margin-bottom: 20px;
    padding-bottom: 25px;
    width: 220px;
}
.top-banner span.coming-soon {
	font: 700 25px/30px "Roboto";
}
.top-banner h1 {
	font: 500 23px/27px "Roboto";
}
.intro-1 img.video-preview {
	right: -80px;
}
.intro-1 h2 {
	font: 300 30px/30px "Roboto";
	text-align: center;
}
.connected-by-water h2, .location-2 h2 {
	font: 300 25px/30px "Roboto";
}
.intro-2 p, .connected-by-water p, .location-1 p, .location-2 p {
	font: 400 18px/30px "Roboto";
}
.intro-2 {
  margin-top: -50px;
}
.register {
	padding-top: 10px;
	padding-bottom: 30px;
}
.register p {
	font: 500 22px/30px "Roboto";
}
.register .round-button, .bottom-register .round-button, .bottom-register .color-palette .round-button {
	width: 170px;
	font: 500 18px/25px "Roboto";
	padding: 10px;
}
.bottom-register .color-palette .round-button {
	width: 220px;
	margin-top: 60px;
}
.garden-club h3 {
	font: 500 25px/30px "Roboto";
	color: #969d61;	
}
.garden-club  ul li {
	font: 400 18px/30px "Roboto";
}
.green-banner {
	padding: 15px 0;
}
.green-banner h3 {
	font: 500 30px/35px "Roboto";
}
.green-banner img.flower{
	margin-top: -40px;
	margin-right: 10px;
}
.location-1 img.leaf {
 	height: 180px;
	margin-top: -20px;
    right: -240px;
}
.location-1 {
  padding: 20px 0;
}
.location-2 {
	padding: 20px 0;
    background-image: none;
	margin-top: -160px;
}
.leaf-bg {
	background-size: 42%;
  	background-position: -60px;
}
.location-3 h3 {
	font: 500 22px/30px "Roboto";
	padding-left: 15px;
}
.location-3 ul {
	font: 400 17px/28px "Roboto";
	padding-left: 15px;
}
.location-3 img.icon {
	margin-left: 15px;
	margin-bottom: 20px;
	height: 80px;
}
.red-divider {
	border-right: 0;
}
.white-bg, .grey-bg {
	padding: 20px 0;
}
	
.perfectly-personalized .flower {
	right: -30px;
	top: -80px;
	width: 120px;
}
.perfectly-personalized h2 {
    font: 500 30px/35px "Roboto";
}
.perfectly-personalized p {
	font: 400 18px/26px "Roboto";
}
.bottom-register .color-palette {
	height: 180px;
}
.register p, .bottom-register p {
	font: 400 19px/27px "Roboto";
}
#video-link-modal .modal-dialog {
	max-width: 90%;
}	
}
@media (max-width: 767.98px) {
	.intro-1 img.video-preview {
		right: -50px;
	}
	.location-2 {
		margin-top: 10px;
	}
	.location-1 img.leaf {
		display: none;
	}
	.intro-2 {
		margin-top: 15px;
	}
}
@media (max-width: 600px) {
	.leaf-bg {
		background-size: 54%;
	}
	.intro-1 h2 {
		font: 300 25px/25px "Roboto";
		text-align: left;
		padding-top: 10px;
	}
	.intro-1 img.video-preview {
		right: 0;
	}
	.green-banner img.flower {
		width: 78px;
		margin-top: -40px;
		margin-right: 0;
	  }
	.green-banner h3 {
		font: 500 18px/25px "Roboto";
	  }
	.perfectly-personalized .flower {
		right: 0;
		top: -70px;
		width: 100px;
	}	
}

/** Promo Section */
.max-width-container {
	max-width: 93.75rem;
	margin: 0 auto;
}
.promo {
	background: #f7f7f7;
}
.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;
}
@media (max-width: 768px) {
	.promo-container {
		padding: 0;
	}
}

/** 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;
}
}

.swiper-button-next, .swiper-button-prev {
    color: #fff !important;
}