1<!doctype html> 2<html class="no-js" lang="en"> 3 4 <head> 5 <title>The Waters of Wakarusa</title> 6 <meta charset="utf-8"> 7 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 8 <meta name="author" content="NDH Web Design"> 9 <meta name="viewport" content="width=device-width,initial-scale=1.0" /> 10 <meta name="description" content=""> 11 <!-- favicon icon --> 12 <link rel="shortcut icon" href="images/favicon.png"> 13 <link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png"> 14 <link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png"> 15 <link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png"> 16 <!-- google fonts preconnect --> 17 <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin> 18 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 19 <!-- style sheets and font icons --> 20 <link rel="stylesheet" href="css/vendors.min.css" /> 21 <link rel="stylesheet" href="css/icon.min.css" /> 22 <link rel="stylesheet" href="css/style.css"/> 23 <link rel="stylesheet" href="css/responsive.css"/> 24 <link rel="stylesheet" href="demos/branding-agency/branding-agency.css" /> 25 <style> 26 /* "Want To Connect" button and full horizontal nav were competing for 27 space in the range just above the hamburger breakpoint, causing the 28 button to disappear early. Instead: keep the button visible all the 29 way down to where the hamburger takes over, and hide the "Work With 30 Us" nav item in that squeezed range to make room. Below 992px the 31 hamburger menu takes over anyway (Work With Us and Want To Connect 32 both remain available there, inside the collapsed menu). 33 34 NOTE: 1250px is a starting estimate for where things stop being 35 cramped â adjust this number if it's not quite right on your actual 36 screen sizes. */ 37 @media (min-width: 992px) and (max-width: 1350px) { 38 .work-with-us-item { 39 display: none !important; 40 } 41 } 42 @media (min-width: 992px) { 43 .connect-btn-col { 44 display: flex !important; 45 } 46 } 47 @media (max-width: 991.98px) { 48 .connect-btn-col { 49 display: none !important; 50 } 51 } 52 </style> 53 </head> 54 <body data-mobile-nav-trigger-alignment="right" data-mobile-nav-style="modern" data-mobile-nav-bg-color="#1d1d1d"> 55 <!-- start header --> 56 <header> 57 <!-- start navigation --> 58 <nav class="navbar navbar-expand-lg header-light bg-white header-reverse glass-effect"> 59 <div class="container-fluid"> 60 <div class="col-auto col-lg-2 me-lg-0 me-auto"> 61 <a class="navbar-brand" href="index.php"> 62 <img src="images2/logo_new_bold.png" alt="The Waters of Wakarusa" class="default-logo"> 63 <img src="images2/logo_new_bold.png" alt="The Waters of Wakarusa" class="alt-logo"> 64 <img src="images2/logo_new_bold.png" alt="The Waters of Wakarusa" class="mobile-logo"> 65 </a> 66 </div> 67 <div class="col-auto ms-auto md-ms-0 menu-order position-static"> 68 <button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation"> 69 <span class="navbar-toggler-line"></span> 70 <span class="navbar-toggler-line"></span> 71 <span class="navbar-toggler-line"></span> 72 <span class="navbar-toggler-line"></span> 73 </button> 74 <div class="collapse navbar-collapse justify-content-center" id="navbarNav"> 75 <ul class="navbar-nav alt-font"> 76 <li class="nav-item dropdown dropdown-with-icon-style02"> 77 <a href="index.php" class="nav-link">Welcome In</a> 78 <i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i> 79 <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> 80 <!-- <li><a href="in-motion.php"><i class="bi bi-megaphone text-dark-gray"></i>Memory Springs</a></li>--> 81 <li><a href="looking-for-myself.php"><i class="bi text-dark-gray"></i>Here for Myself</a></li> 82 <li><a href="looking-for-a-loved-one.php"><i class="bi text-dark-gray"></i>
82Here for a Loved One</a></li> 83 </ul> 84 </li> 85 <li class="nav-item"><a href="why-the-waters.php" class="nav-link">Why The Waters</a></li> 86 <li class="nav-item dropdown dropdown-with-icon-style02"> 87 <a href="in-motion.php" class="nav-link">Ways We Care</a> 88 <i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i> 89 <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> 90 <li><a href="in-motion.php"><i class="bi bi-motion text-dark-gray"></i>In Motion</a></li> 91 <li><a href="services.php"><i class="bi bi-service text-dark-gray"></i>Additional Services</a></li> 92 </ul> 93 </li> 94 <li class="nav-item"><a href="wellness-and-wisdom.php" class="nav-link">Wellness & Wisdom</a></li> 95 <li class="nav-item work-with-us-item"><a href="work-with-us.php" class="nav-link">Work With Us</a></li> 96 <li class="nav-item d-lg-none"><a href="contact.php" class="nav-link">Want To Connect</a></li> 97 </ul> 98 </div> 99 </div> 100 <div class="col-auto text-end connect-btn-col"> 101 <div class="header-icon"> 102 <div class="header-button"> 103 <a href="contact.php" class="btn border-1 btn-transparent-light-gray btn-medium left-icon btn-switch-text"> 104 <span> 105 <span><i class="fa-regular fa-envelope"></i></span> 106 <span class="btn-double-text" data-text="Send a message">Want To Connect</span> 107 </span> 108 </a> 109 </div> 110 </div> 111 </div> 112 </div> 113 </nav> 114 <!-- end navigation --> 115 </header> 116 <!-- end header --> 117<style> 118 /* Larger, more readable paragraph text */ 119 p { 120 font-size: 1.5rem; 121 line-height: 2; 122 color: #3a3a3a; 123 } 124 125 /* Fully rounded hero overlay box */ 126 .hero-overlay { 127 border-radius: 12px !important; 128 } 129 130 /* Hero CTA buttons â bigger than the theme default at every size */ 131 .btn-hero1, .btn-hero2 { 132 font-size: 1.15rem !important; 133 padding: 16px 32px !important; 134 } 135 136 /* Space between hero buttons area and bottom of viewport on mobile */ 137 @media (max-width: 768px) { 138 .hero { 139 padding-bottom: 80px; 140 } 141 .hero-overlay { 142 bottom: 20px; 143 border-radius: 12px !important; 144 } 145 146 /* Living Well â breathing room between Learn More button and footer */ 147 .sm-pb-60px { 148 padding-bottom: 60px !important; 149 } 150 151 /* Hero CTA buttons need to be noticeably bigger on mobile, not just desktop-sized */ 152 .btn-hero1, .btn-hero2 { 153 font-size: 1.35rem !important; 154 padding: 18px 28px !important; 155 width: 100%; 156 text-align: center; 157 } 158 } 159 160 /* Hero slideshow styles */ 161 .hero-slideshow { 162 position: absolute; 163 inset: 0; 164 z-index: 0; 165 overflow: hidden; 166 } 167 168 .hero-slide { 169 position: absolute; 170 inset: 0; 171 opacity: 0; 172 transition: opacity 1s ease-in-out; 173 pointer-events: none; 174 } 175 176 .hero-slide.active { 177 opacity: 1; 178 pointer-events: auto; 179 } 180 181 /* Image slide â uses the existing hero background approach */ 182 .hero-slide-image { 183 position: absolute; 184 inset: -10%; 185 background-size: cover; 186 background-position: center; 187 background-repeat: no-repeat; 188 will-change: transform; 189 } 190 191 @keyframes kenBurns { 192 0% { transform: scale(1) translate(0%, 0%); } 193 100% { transform: scale(1.2) translate(4%, -4%); } 194 } 195 196 /* Video slide â object-fit: cover auto-crops to fill */ 197 .hero-slide-video { 198 width: 100%; 199 height: 100%; 200 object-fit: cover; 201 object-position: center; 202 display: block; 203 } 204 205 /* Make sure the hero has relative positioning so slideshow sits behind overlay */ 206 .hero { 207 position: relative; 208 } 209 210 /* Ensure overlay stays above slideshow */ 211 .hero-overlay { 212 z-index: 2; 213 } 214</style> 215 216<!-- Hero Section --> 217<section class="hero"> 218 219 <!-- Slideshow background (sits behind everything) --> 220 <div class="hero-slideshow"> 221 <!-- Slide 1: Image (uses your existing hero background image from CSS/header) --> 222 <div class="hero-slide active" id="heroSlide1"> 223 <div class="hero-slide-image" id="heroSlideInner"></div> 224 </div> 225 226 </div> 227 228 <!-- Blue overlay box with buttons â always on top --> 229 <div class="hero-overlay"> 230 <h1 class="hero-title">Live Well at The Waters</h1> 231 <div class="hero-buttons"> 232 <a href="looking-for-myself.php" class="btn btn-hero1">I'm Here For Myself</a> 233 <a href="looking-for-a-loved-one.php" class="btn btn-hero2">
233I'm Here For A Loved One</a> 234 </div> 235 </div> 236</section> 237
238<script> 239(function () { 240 const slide1 = document.getElementById('heroSlide1'); 241 242 // Pull the hero's background-image from CSS and apply it to slide 1 243 // so we're using the exact same image your stylesheet already defines. 244 function syncHeroBg() { 245 const hero = document.querySelector('.hero'); 246 const inner = document.getElementById('heroSlideInner'); 247 if (hero && inner) { 248 const bg = window.getComputedStyle(hero).backgroundImage; 249 if (bg && bg !== 'none') { 250 inner.style.backgroundImage = bg; 251 hero.style.backgroundImage = 'none'; 252 } 253 } 254 } 255 256 257 // Init on DOM ready 258 document.addEventListener('DOMContentLoaded', function () { 259 syncHeroBg(); 260 }); 261})(); 262</script>
262 263 264<!-- end banner --> 265<!-- start section --> 266<section><div class="logo-strip"> 267 <div class="logo-inner" id="logoInner"> 268 <a href="https://watersofbatesville.com" target="_blank"><img src="images2/batesville.png" alt=""></a> 269 <a href="https://watersofcastleton.com" target="_blank"><img src="images2/castleton.png" class="logo-slide" alt=""></a> 270 <a href="https://watersofchesterfield.com" target="_blank"><img src="images2/chesterfield.png" class="logo-slide" alt=""></a> 271 <a href="https://watersofcliftyfalls.com" target="_blank"><img src="images2/clifty_falls.png" class="logo-slide" alt=""></a> 272 <a href="https://watersofcastleton.com" target="_blank"><img src="images2/castleton.png" class="logo-slide" alt=""></a> 273 <a href="https://watersofchesterfield.com" target="_blank"><img src="images2/chesterfield.png" class="logo-slide" alt=""></a> 274 <a href="https://watersofcliftyfalls.com" target="_blank"><img src="images2/clifty_falls.png" class="logo-slide" alt=""></a> 275 <a href="https://watersofcastleton.com" target="_blank"><img src="images2/castleton.png" class="logo-slide" alt=""></a> 276 <a href="https://watersofchesterfield.com" target="_blank"><img src="images2/chesterfield.png" class="logo-slide" alt=""></a> 277 <a href="https://watersofcliftyfalls.com" target="_blank"><img src="images2/clifty_falls.png" class="logo-slide" alt=""></a> 278 </div> 279</div> 280 281<!-- start section --> 282<section class="pt-0"> 283 <div class="container"> 284 <div class="row"> 285 <div class="col-lg-6 position-relative"> 286 <div class="row align-items-center position-relative md-mb-15" data-anime='{ "opacity": [0,1], "duration": 600, "delay":0, "staggervalue": 300, "easing": "easeOutQuad" }'> 287 <div class="col-md-5 sm-mb-30px" data-bottom-top="transform: translateY(50px)" data-top-bottom="transform: translateY(-50px)"> 288 <img class="w-100" src="images2/about-us1.jpg" alt="" /> 289 </div> 290 <div class="col-lg-7 col-md-7 sm-mb-30px text-end" data-bottom-top="transform: translateY(-30px)" data-top-bottom="transform: translateY(30px)"> 291 <img src="images2/about-us2.jpg" alt="" class="box-shadow-quadruple-large md-w-100" /> 292 </div> 293 <div class="w-50 sm-w-100 overflow-hidden position-absolute sm-position-relative left-140px bottom-minus-200px sm-bottom-0px sm-left-0px p-0 sm-ps-15px sm-pe-15px" data-shadow-animation="true" data-animation-delay="100" data-bottom-top="transform: translateY(20px)" data-top-bottom="transform: translateY(-20px)"> 294 <img src="images2/about-us3.jpg" alt="" class="box-shadow-quadruple-large w-100" /> 295 </div> 296 </div> 297 </div> 298 <div class="col-xl-5 col-lg-6 offset-xl-1 md-mt-20 sm-mt-0" data-anime='{ "el": "childs", "translateY": [30, 0], "opacity": [0,1], "duration": 600, "delay":0, "staggervalue": 300, "easing": "easeOutQuad" }'> 299 <div class="mb-10px"> 300 <span class="w-25px h-1px d-inline-block bg-base-color me-5px align-middle"></span> 301 <span class="text-gradient-base-color fs-15 alt-font fw-700 ls-05px text-uppercase d-inline-block align-middle">Who We Are</span> 302 </div> 303 <h4 class="text-dark-gray alt-font fw-600 ls-minus-2px mb-20px">At The Waters of Wakarusa, care is more than what we do - it's who we are.</h4> 304 <p class="w-90 md-w-100 mb-35px sm-mb-20px">For decades, our team has created a place where residents feel safe, supported, and truly at home. From short term rehabilitation to long term living, our mission is simple: help every individual live well, every day. </p> 305 </div> 306 </div> 307 </div><br/><br/><br/> 308</section> 309<!-- end section --> 310 311<!-- start section 312<section class="pt-0 border-top border-color-extra-medium-gray mt-6 md-mt-0 sm-border-top-0"> 313 <div class="container"> 314 <div class="row row-cols-1 row-cols-md-3 row-cols-sm-2 g-0" data-anime='{ "el": "childs", "translateX": [30, 0], "opacity": [0,1], "duration": 600, "delay":0, "staggervalue": 300, "easing": "easeOutQuad" }'> 315 <!-- start process step item 316 <div class="col process-step-style-06 last-paragraph-no-margin hover-box sm-mb-50px"> 317 <div class="process-step-icon-box position-relative top-minus-14px">
318 <span class="progress-step-separator bg-light-gray w-100 separator-line-1px opacity-1"></span> 319 <div class="step-box d-flex align-items-center justify-content-center bg-white border-radius-100 w-25px h-25px position-relative border border-color-extra-medium-gray box-shadow-large"> 320 <span class="w-7px h-7px bg-dark-gray border-radius-100"></span> 321 </div> 322 </div> 323 <span class="d-block alt-font text-dark-gray fw-600 mb-10px mt-15px fs-22 lh-28 ls-minus-05px w-60 lg-w-75 md-w-100">Over 1336+ success worldwide projects.</span> 324 <p class="w-60 lg-w-75 md-w-100 sm-w-100">We create compelling web designs, which are the right-fit for your target groups.</p> 325 </div> 326 <!-- end process step item --> 327 <!-- start process step item 328 <div class="col process-step-style-06 last-paragraph-no-margin hover-box sm-mb-50px"> 329 <div class="process-step-icon-box position-relative top-minus-14px"> 330 <span class="progress-step-separator bg-light-gray w-100 separator-line-1px opacity-1"></span> 331 <div class="step-box d-flex align-items-center justify-content-center bg-white border-radius-100 w-25px h-25px position-relative border border-color-extra-medium-gray box-shadow-large"> 332 <span class="w-7px h-7px bg-dark-gray border-radius-100"></span> 333 </div> 334 </div> 335 <span class="d-block alt-font text-dark-gray fw-600 mb-10px mt-15px fs-22 lh-28 ls-minus-05px w-60 lg-w-75 md-w-100">Over 756+ happy clients and counting.</span> 336 <p class="w-60 lg-w-75 md-w-100 sm-w-100">We create compelling web designs, which are the right-fit for your target groups.</p> 337 </div> 338 <!-- end process step item --> 339 <!-- start process step item 340 <div class="col process-step-style-06 last-paragraph-no-margin hover-box"> 341 <div class="process-step-icon-box position-relative top-minus-14px"> 342 <span class="progress-step-separator bg-light-gray w-100 separator-line-1px opacity-1"></span> 343 <div class="step-box d-flex align-items-center justify-content-center bg-white border-radius-100 w-25px h-25px position-relative border border-color-extra-medium-gray box-shadow-large"> 344 <span class="w-7px h-7px bg-dark-gray border-radius-100"></span> 345 </div> 346 </div> 347 <span class="d-block alt-font text-dark-gray fw-600 mb-10px mt-15px fs-22 lh-28 ls-minus-05px w-60 lg-w-75 md-w-100">Our presence in over 11+ countries.</span> 348 <p class="w-60 lg-w-75 md-w-100 sm-w-100">We create compelling web designs, which are the right-fit for your target groups.</p> 349 </div> 350 <!-- end process step item 351 </div> 352 </div> 353</section> 354<!-- end section --> 355 356<!-- start section --> 357<section class="overflow-hidden position-relative pt-0 lg-pb-0"> 358 <div class="container-fluid"> 359 <div class="row position-relative"> 360 <div class="col swiper swiper-width-auto feather-shadow text-center" data-slider-options='{ "slidesPerView": "auto", "spaceBetween":40, "speed": 20000, "loop": true, "allowTouchMove": false, "autoplay": { "delay":0, "disableOnInteraction": false, "reverseDirection": true }, "effect": "slide" }'> 361 <div class="swiper-wrapper pb-30px marquee-slide"> 362 <!-- start client item --> 363 <div class="swiper-slide"> 364 <div class="fs-130 md-fs-90 sm-fs-70 alt-font text-dark-gray fw-600 ls-minus-6px sm-ls-minus-2px word-break-normal">Welcome to The Waters of Wakarusa<span class="ms-20px">-</span></div> 365 </div> 366 <!-- end client item --> 367 <!-- start client item --> 368 <div class="swiper-slide"> 369 <div class="fs-130 md-fs-90 sm-fs-70 alt-font text-dark-gray fw-600 ls-minus-6px sm-ls-minus-2px word-break-normal">Welcome to The Waters of Wakarusa<span class="ms-20px">-</span></div> 370 </div> 371 <!-- end client item --> 372 </div> 373 </div> 374 </div> 375 </div> 376</section> 377<!-- end section --> 378 379<!-- start section --> 380<section class="stack-box py-0 z-index-99"> 381 <div class="stack-box-contain"> 382 <!-- start stack item 383 <div class="stack-item stack-item-01 bg-white lg-pt-8 lg-pb-8 md-pb-0"> 384 <div class="stack-item-wrapper"> 385 <div class="container-fluid"> 386 <div class="row align-items-center full-screen md-
386h-auto"> 387 <div class="col-lg-6 cover-background overflow-visible h-100 md-h-500px" style="background-image: url(images2/memory-springs.jpg)"> 388 <div class="position-absolute right-0px bottom-minus-1px"> 389 <div class="vertical-title-center"> 390 <div class="title fw-700 fs-15 alt-font text-uppercase text-dark-gray bg-white pt-30px pb-30px ps-10px pe-10px"> 391 <span class="d-inline-block">Memory Springs</span> 392 </div> 393 </div> 394 </div> 395 </div> 396 <div class="col-lg-6 ps-12 pe-14 xxl-ps-10 xxl-pe-10 xl-pe-8 lg-ps-6 lg-pe-4 md-p-50px sm-ps-30px sm-pe-30px position-relative align-self-center text-md-start text-center"> 397 <div class="mb-15px"> 398 <span class="w-25px h-1px d-inline-block bg-base-color me-5px align-middle"></span> 399 <span class="text-gradient-base-color fs-15 alt-font fw-700 ls-05px text-uppercase d-inline-block align-middle"></span> 400 </div> 401 <img src="images/memory_springs.png" class="service"> 402 <!-- <h1 class="text-dark-gray alt-font fw-600 ls-minus-4px mb-25px">Memory Springs</h1> 403 <p class="w-95 md-w-100 mb-35px">The Waters of Wakarusa offers personalized memory care that encourages connection, comfort, and living each day to the fullest. Our program is specialized to ensure everyone is living their Best Day, every day.</p> 404 <a href="demo-branding-agency-single-project-slider.html" class="btn btn-large btn-dark-gray btn-switch-text btn-box-shadow fw-400"> 405 <span> 406 <span class="btn-double-text" data-text="Click Here">Learn More</span> 407 <span><i class="feather icon-feather-arrow-right"></i></span> 408 </span> 409 </a> 410 </div> 411 </div> 412 </div> 413 </div> 414 </div> 415 <!-- end stack item --> 416 <!-- start stack item --> 417 <div class="stack-item stack-item-02 bg-linen md-pt-0 md-pb-0"> 418 <div class="stack-item-wrapper"> 419 <div class="container-fluid"> 420 <div class="row align-items-center full-screen md-h-auto"> 421 <div class="col-lg-6 cover-background overflow-visible h-100 md-h-500px" style="background-image: url(images2/in-motion.jpg)"> 422 <div class="position-absolute right-0px bottom-minus-1px"> 423 <div class="vertical-title-center"> 424 <div class="title fw-700 fs-15 alt-font text-uppercase text-dark-gray bg-linen pt-30px pb-30px ps-10px pe-10px"> 425 <span class="d-inline-block">In Motion</span> 426 </div> 427 </div> 428 </div> 429 </div> 430 <div class="col-lg-6 ps-12 pe-14 xxl-ps-10 xxl-pe-10 xl-pe-8 lg-ps-6 lg-pe-4 md-p-50px sm-ps-30px sm-pe-30px position-relative align-self-center text-md-start text-center"> 431 <div class="mb-15px"> 432 <span class="w-25px h-1px d-inline-block bg-base-color me-5px align-middle"></span> 433 <span class="text-gradient-base-color fs-15 alt-font fw-700 ls-05px text-uppercase d-inline-block align-middle"></span> 434 </div> 435 <img src="images/in_motion.png" class="service"> 436 <p class="w-95 md-w-100 mb-35px">At The Waters of Wakarusa, recovery is about more than treatment - it's about helping rebuild strength, confidence, and independence. With our dedicated care team, we help residents reach their fullest potential whether for a short stay or long-term support.</p> 437 <a href="in-motion.php" class="btn btn-large btn-dark-gray btn-switch-text btn-box-sha
437dow fw-400"> 438 <span> 439 <span class="btn-double-text" data-text="Click Here">Learn More</span> 440 <span><i class="feather icon-feather-arrow-right"></i></span> 441 </span> 442 </a> 443 </div> 444 </div> 445 </div> 446 </div> 447 </div> 448 <!-- end stack item --> 449 <!-- start stack item --> 450 <div class="stack-item stack-item-03 bg-white lg-pt-8 md-pb-0 md-pt-0"> 451 <div class="stack-item-wrapper"> 452 <div class="container-fluid"> 453 <div class="row align-items-center full-screen md-h-auto"> 454 <div class="col-lg-6 cover-background overflow-visible h-100 md-h-500px" style="background-image: url(images2/more-care.jpg)"> 455 <div class="position-absolute right-0px bottom-minus-1px"> 456 <div class="vertical-title-center"> 457 <div class="title fw-700 fs-15 alt-font text-uppercase text-dark-gray bg-white pt-30px pb-30px ps-10px pe-10px"> 458 <span class="d-inline-block">Living Well</span> 459 </div> 460 </div> 461 </div> 462 </div> 463 <div class="col-lg-6 ps-12 pe-14 xxl-ps-10 xxl-pe-10 xl-pe-8 lg-ps-6 lg-pe-4 md-p-50px sm-ps-30px sm-pe-30px sm-pb-60px position-relative align-self-center text-md-start text-center"> 464 <div class="mb-15px"> 465 <span class="w-25px h-1px d-inline-block bg-base-color me-5px align-middle"></span> 466 <span class="text-gradient-base-color fs-15 alt-font fw-700 ls-05px text-uppercase d-inline-block align-middle"></span> 467 </div> 468 <img src="images/living_well.png" class="service"> 469 <p class="w-95 md-w-100 mb-35px">We know that every resident's needs are unique. That's why we offer a wide range of specialized services, from wound care to respiratory support. Our services do not end there. Click below to learn more.</p> 470 <a href="services.php" class="btn btn-large btn-dark-gray btn-switch-text btn-box-shadow fw-400"> 471 <span> 472 <span class="btn-double-text" data-text="Click here">Learn More</span> 473 <span><i class="feather icon-feather-arrow-right"></i></span> 474 </span> 475 </a> 476 </div> 477 </div> 478 </div> 479 </div> 480 </div> 481 <!-- end stack item --> 482 </div> 483</section> 484<!-- end section --> 485 486<!-- start section 487<section class="big-section position-relative"> 488 <div class="background-position-center-top background-no-repeat position-absolute h-100 w-100 left-0px top-0px" style="background-image: url('images2/large1.jpg')"></div> 489 <div class="container position-relative"> 490 <div class="row justify-content-center mb-8" data-anime='{ "opacity": [0,1], "duration": 600, "delay":0, "staggervalue": 300, "easing": "easeOutQuad" }'> 491 <div class="col-xl-4 col-md-5"> 492 <h2 class="alt-font text-dark-gray mb-30px fw-600 ls-minus-3px">See What Our Community Says<i class="bi bi-heart-fill d-inline-block align-top ms-10px animation-zoom icon-very-medium text-red"></i></h2> 493 <div class="d-flex md-mb-25px"> 494 <!-- start slider navigation 495 <div class="slider-one-slide-prev-1 text-dark-gray swiper-button-prev slider-navigation-style-04 border border-1 border-color-extra-medium-gray bg-white"><i class="fa-solid fa-arrow-left"></i></div> 496 <div class="slider-one-slide-next-1 text-dark-gray swiper-button-next slider-navigation-style-04 border border-1 border-color-extra-medium-gray bg-white"><i class="fa-solid fa-arrow-right"></i></div> 497 <!-- end slider navigation 498 </div> 499 </div> 500 <div class="col-xl-6 col-md-7 overflow-hidden offset-xl-2">
501 <div class="swiper" data-slider-options='{ "slidesPerView": 1, "spaceBetween": 40, "loop": true, "autoplay": { "delay": 8000, "disableOnInteraction": false }, "navigation": { "nextEl": ".slider-one-slide-next-1", "prevEl": ".slider-one-slide-prev-1" }, "keyboard": { "enabled": true, "onlyInViewport": true }, "breakpoints": { "992": { "slidesPerView": 1 }, "768": { "slidesPerView":1 }, "320": { "slidesPerView": 1 } }, "effect": "slide" }'> 502 <div class="swiper-wrapper"> 503 <!-- start review item 504 <div class="swiper-slide"> 505 <h5 class="text-dark-gray mb-15px w-95 xl-w-100 lh-40 ls-minus-1px alt-font"><span class="text-decoration-line-bottom-medium fw-700">Great facility and staff</span> that provides a home-like environment for their residents.</h5> 506 <span class="text-gradient-base-color fw-700 text-uppercase ls-1px">Jonathan Y.</span> 507 </div> 508 <!-- end review item --> 509 <!-- start review item 510 <div class="swiper-slide"> 511 <h5 class="text-dark-gray mb-15px w-95 xl-w-100 lh-40 ls-minus-1px alt-font">Staff and management are so <span class="text-decoration-line-bottom-medium fw-700">professional and knowledgeable.</span> Very impressed with facility and how clean it was. Would definitely recommend for any of my love ones.</h5> 512 <span class="text-gradient-base-color fw-700 text-uppercase ls-1px">Janice C.</span> 513 </div> 514 <!-- end review item 515 </div> 516 </div> 517 </div> 518 </div> 519 </div> 520</section> 521<!-- end section --> 522
523<script> 524document.addEventListener("DOMContentLoaded", function () { 525 const inner = document.getElementById("logoInner"); 526 527 // Duplicate for seamless loop 528 inner.innerHTML += inner.innerHTML; 529 530 let x = 0; 531 532 function scrollLogos() { 533 x -= 1; // speed 534 inner.style.transform = `translateX(${x}px)`; 535 536 if (Math.abs(x) >= inner.scrollWidth / 2) { 537 x = 0; 538 } 539 540 requestAnimationFrame(scrollLogos); 541 } 542 543 scrollLogos(); 544}); 545</script>
545 546 547<!-- start footer --> 548 <footer class="bg-charcoal-blue pb-4 sm-pb-50px" style="background-image: url(images/demo-branding-agency-pattern.svg)"> 549 <div class="container"> 550 <div class="row mb-6"> 551 <div class="col-lg-5 col-md-6 col-12 mb-40px"> 552 <h3 class="text-white fw-500 alt-font mb-50px ls-minus-1px sm-mb-30px">Live Well at The Waters</h3> 553 <div> 554 555 <span class="alt-font fs-14 text-uppercase d-block text-white ls-1px lh-24">Call Us</span> 556 <a href="tel:15748624511">(574) 862-4511</a><br/><br/> 557</div> 558 <div> 559 <span class="alt-font fs-14 text-uppercase d-block text-white ls-1px lh-24">Send a message</span> 560 <a href="mailto:[email protected]">[email protected]</a> 561 </div> 562 563 </div> 564 <div class="col-md-2 offset-lg-1 col-12 mb-40px"> 565 <span class="alt-font fs-14 text-uppercase mb-5px d-block text-white ls-1px">Links</span> 566 <ul> 567 <li><a href="index.php">Welcome In</a></li> 568 <li><a href="why-the-waters.php">Why the Waters</a></li> 569 <li><a href="in-motion.php">In Motion</a></li> 570 <li><a href="services.php">Additional Services</a></li> 571 <li><a href="wellness-and-wisdom.php">Wellness & Wisdom</a></li> 572 <li><a href="images/wakarusa_brochure.pdf" target="_blank">Our Brochure</a></li> 573 <li><a href="/virtual_tour" target="_blank">Virtual Tour</a></li> 574 <li><a href="contact.php">Contact Us</a></li> 575 </ul> 576 </div> 577 <div class="col-md-4 col-12 mb-40px"> 578<div id="grwf21560_wrap" style="width:100%;padding:0 0 24px;box-sizing:border-box;overflow:hidden;font-family:Georgia,serif;"> 579 <div style="max-width:780px;margin:0 auto;padding:0 24px;"> 580 <div id="grwf21560_track"></div> 581 <div id="grwf21560_dots" style="display:flex;justify-content:center;gap:7px;margin-top:20px;"></div> 582 </div> 583</div> 584 585<style> 586#grwf21560_track .grw-slide{display:none;} 587#grwf21560_track .grw-slide.grw-on{display:block;animation:grwFade 0.55s ease;} 588@keyframes grwFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}} 589#grwf21560_track .grw-card{display:flex;align-items:flex-start;gap:18px;} 590#grwf21560_track .grw-av{width:46px;height:46px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid #f0c040;} 591#grwf21560_track .grw-avf{width:46px;height:46px;border-radius:50%;flex-shrink:0;background:rgba(255,255,255,0.1);border:2px solid #f0c040;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:bold;color:#f0c040;font-family:sans-serif;} 592#grwf21560_track .grw-body{flex:1;min-width:0;} 593#grwf21560_track .grw-stars{color:#f0c040;font-size:18px;letter-spacing:1px;margin-bottom:6px;} 594#grwf21560_track .grw-text{color:#d8d8e8;font-size:18px;line-height:1.65;margin:0 0 10px;font-style:italic;} 595#grwf21560_track .grw-meta{display:flex;align-items:center;gap:10px;} 596#grwf21560_track .grw-author{color:#f0c040;font-family:sans-serif;font-size:13px;font-weight:600;letter-spacing:.03em;} 597#grwf21560_track .grw-time{color:#7878a0;font-family:sans-serif;font-size:12px;} 598#grwf21560_dots .grw-dot{width:7px;height:7px;border-radius:50%;background:#3a3a5c;border:none;padding:0;cursor:pointer;transition:background .3s,transform .3s;} 599#grwf21560_dots .grw-dot.grw-on{background:#f0c040;transform:scale(1.3);} 600</style> 601
602<script> 603(function(){ 604 var PROXY = '/widget/reviews-proxy.php'; 605 var ID = 'grwf21560'; 606 var DELAY = 3500; 607 var track, dotsEl, slides = [], current = 0, timer = null; 608 609 function esc(s){ 610 return String(s||'').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"'); 611 } 612 function initials(n){ 613 return String(n||'?').split(' ').slice(0,2).map(function(w){return w[0]||'';}).join('').toUpperCase()||'?'; 614 } 615 function goTo(i){ 616 if(!slides.length) return; 617 slides[current].classList.remove('grw-on'); 618 dotsEl.children[current].classList.remove('grw-on'); 619 current=((i%slides.length)+slides.length)%slides.length; 620 slides[current].classList.add('grw-on'); 621 dotsEl.children[current].classList.add('grw-on'); 622 } 623 function startRotation(){ 624 if(slides.length<2) return; 625 timer=setInterval(function(){goTo(current+1);},DELAY); 626 } 627 function buildSlides(reviews){ 628 reviews.forEach(function(r,i){ 629 var slide=document.createElement('div'); 630 slide.className='grw-slide'+(i===0?' grw-on':''); 631 var av=r.photo 632 ?'<img class="grw-av" src="'+esc(r.photo)+'" alt="" loading="lazy">' 633 :'<div class="grw-avf">'+esc(initials(r.author))+'</div>'; 634 var text=String(r.text||''); 635 if(text.length>220) text=text.slice(0,217)+'\u2026'; 636 slide.innerHTML='<div class="grw-card">'+av+'<div class="grw-body">' 637 +'<div class="grw-stars">\u2605\u2605\u2605\u2605\u2605</div>' 638 +'<p class="grw-text">\u201c'+esc(text)+'\u201d</p>' 639 +'<div class="grw-meta"><span class="grw-author">'+esc(r.author||'Anonymous')+'</span>' 640 641 +'</div></div></div>'; 642 track.appendChild(slide); 643 slides.push(slide); 644 var dot=document.createElement('button'); 645 dot.className='grw-dot'+(i===0?' grw-on':''); 646 dot.setAttribute('aria-label','Review '+(i+1)); 647 (function(idx){dot.addEventListener('click',function(){clearInterval(timer);goTo(idx);startRotation();});})(i); 648 dotsEl.appendChild(dot); 649 }); 650 track.addEventListener('mouseenter',function(){clearInterval(timer);}); 651 track.addEventListener('mouseleave',startRotation); 652 startRotation(); 653 } 654 655 function init(){ 656 track = document.getElementById(ID+'_track'); 657 dotsEl = document.getElementById(ID+'_dots'); 658 if(!track||!dotsEl) return; 659 var xhr=new XMLHttpRequest(); 660 xhr.open('GET',PROXY,true); 661 xhr.onreadystatechange=function(){ 662 if(xhr.readyState!==4) return; 663 try{ 664 var data=JSON.parse(xhr.responseText); 665 var reviews=data.reviews||[]; 666 if(reviews.length) buildSlides(reviews); 667 }catch(e){} 668 }; 669 xhr.onerror=function(){}; 670 xhr.send(); 671 } 672 673 if(document.readyState==='loading'){ 674 document.addEventListener('DOMContentLoaded',init); 675 } else { 676 init(); 677 } 678}()); 679</script>
679 </div> 680 681 </div> 682 <div class="row"> 683 <div class="col-md-7 last-paragraph-no-margin"> 684 <p class="fs-13 lh-22 w-95 sm-w-100"></p> 685 </div> 686 <div class="col-md-5 text-md-end sm-mt-15px last-paragraph-no-margin"> 687 <p class="text-white fs-13 lh-22">© 2026 The Waters of Wakarusa - Created by <a href="https://www.ndhweb.com/" target="_blank" class="text-decoration-line-bottom text-white">NDH Web Design</a></p> 688 </div> 689 </div> 690 </div> 691 </footer> 692 <!-- end footer --> 693 <!-- start scroll progress --> 694 <div class="scroll-progress d-none d-xxl-block"> 695 <a href="#" class="scroll-top" aria-label="scroll"> 696 <span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span> 697 </a> 698 </div> 699 <!-- end scroll progress --> 700 <!-- javascript libraries --> 701
701<script type="text/javascript" src="js/jquery.js"></script>
701 702
702<script type="text/javascript" src="js/vendors.min.js"></script>
702 703
703<script type="text/javascript" src="js/main.js"></script>
703 704 705 </body> 706</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.