/*





Theme Name: Sonata Bay








Author: Senior Publishing





Description: Sonata Bay community theme with a public website, protected Residents Only section, responsive layouts, and blue styling.





Version: 1.0.25





Requires at least: 5.8








Requires PHP: 7.4





Text Domain: sonata-bay





*/











:root {





    --sbc-dark: #0c9daa;





    --sbc-dark-hover: #0c9daa;





    --sbc-gold: #8edfe7;





    --sbc-light: #d1f7fa;





    --sbc-light-2: #d1f7fa;





    --sbc-text: #333333;





    --sbc-muted: #666666;





    --sbc-border: rgba(12,157,170,0.20);





    --sbc-shadow: 0 12px 35px rgba(0,0,0,.24);





}











* { box-sizing: border-box; }











html { scroll-behavior: smooth; }











body {





    margin: 0;





    background: #0c9daa;





    color: var(--sbc-text);





    font-family: Georgia, 'Times New Roman', serif;





    font-size: 17px;





    line-height: 1.65;





}











/* v1.0.3 - Dark outer background with a Very Light Maroon content panel. */





body,





.site {





    background-color: #0c9daa !important;





}











.site-content,





.content-area,





.sbc-page-layout,





.sbc-main-content,





.entry-content {





    background-color: #d1f7fa !important;





}











/* v1.0.4 - Lighter content panel and high-contrast navigation. */





.site-content,





.content-area,





.sbc-page-layout,





.sbc-main-content,





.entry-header,





.entry-content,





.entry-footer {





    background-color: #d1f7fa !important;





}











.site-header > .main-navigation a,





.site-header > .main-navigation .sub-menu a {





    color: #FFFFFF !important;





}











.site-header > .main-navigation a:hover,





.site-header > .main-navigation a:focus,





.site-header > .main-navigation .current-menu-item > a,





.site-header > .main-navigation .current_page_item > a,





.site-header > .main-navigation .current-menu-ancestor > a {





    background-color: #d1f7fa !important;





    color:#033e4f !important;





}











a { color:#033e4f; text-decoration-thickness: 1px; text-underline-offset: 3px; }





a:hover { color:#033e4f; }











img { max-width: 100%; height: auto; }











.site {





    width: calc(100% - 24px);





    max-width: 1800px;





    margin: 0 auto;





    background: #d1f7fa;





    min-height: 100vh;





    box-shadow: var(--sbc-shadow);





}











.site-header {





    background: var(--sbc-light);





    border-bottom: 5px solid var(--sbc-gold);





    padding: 26px 44px;





}











.header-inner {





    display: flex;





    flex-direction: column;





    gap: 6px;





}











.header-brand-row {





    display: flex;





    align-items: center;





    gap: 16px;





    width: 100%;





    min-width: 0;





}











.site-logo { flex: 0 0 auto; }





.custom-logo { max-height: 76px; width: auto; display: block; }





.sbc-banner-site-title {





    display: block;





    padding: 28px 32px;





    color: #fff;





    font-size: clamp(32px, 5vw, 64px);





    font-weight: 700;





    line-height: 1.05;





    text-align: center;





    text-decoration: none;





}











.site-name-wrap {





    flex: 1 1 auto;





    min-width: 0;





}











.site-title {





    margin: 0;





    color:#033e4f;





    font-family: Georgia, 'Times New Roman', serif;





    font-size: clamp(30px, 4.4vw, 54px);





    font-weight: 700;





    line-height: 1.02;





    white-space: nowrap;





}











.site-title a { color:#033e4f; text-decoration: none; }











.header-bottom-row {





    display: flex;





    align-items: center;





    justify-content: space-between;





    gap: 28px;





    width: 100%;





    padding-left: 92px;





}











.site-description {





    margin: 0;





    color:#033e4f;





    font-size: clamp(15px, 1.35vw, 20px);





    font-style: italic;





    line-height: 1.3;





    flex: 1 1 auto;





}











.main-navigation { margin-left: auto; flex: 0 1 auto; }





.main-navigation ul { margin: 0; padding: 0; list-style: none; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px 12px; }





.main-navigation li { position: relative; }





.main-navigation a {





    display: block;





    color:#033e4f;





    text-decoration: none;





    font-family: Arial, Helvetica, sans-serif;





    font-size: 15px;





    font-weight: 700;





    padding: 10px 12px;





    border-radius: 999px;





}





.main-navigation a:hover,





.main-navigation .current-menu-item > a,





.main-navigation .current_page_item > a {





    background: var(--sbc-dark);





    color: #fff;





}











.site-content {





    width: 100%;





    padding: 42px clamp(24px, 3vw, 54px) 56px;





    background: #d1f7fa;





}











.page-layout {





    display: grid;





    grid-template-columns: minmax(0, 1fr) 320px;





    gap: 42px;





    align-items: start;





}











.content-area { min-width: 0; }











.entry-header { margin-bottom: 22px; }





.entry-title {





    margin: 0 0 12px;





    color:#033e4f;





    font-size: clamp(32px, 4vw, 52px);





    line-height: 1.12;





}





.entry-title a { color:#033e4f; text-decoration: none; }





.entry-meta { color: var(--sbc-muted); font-family: Arial, Helvetica, sans-serif; font-size: 14px; margin-bottom: 18px; }











.entry-content,





.entry-summary { max-width: 100%; }





.entry-content > *:first-child { margin-top: 0; }





.entry-content h1,





.entry-content h2,





.entry-content h3,





.entry-content h4,





.entry-content h5,





.entry-content h6 { color:#033e4f; line-height: 1.2; }





.entry-content p { margin: 0 0 1.25em; }











.page .entry-content { max-width: 100%; }





.single-post .site-content { max-width: 1180px; margin: 0 auto; }





.single-post .entry-content,





.single-post .entry-header,





.single-post .entry-footer { max-width: 1040px; margin-left: auto; margin-right: auto; }











.single-post .entry-content iframe,





.single-post .entry-content .wp-block-html,





.single-post .entry-content .wp-block-embed,





.single-post .entry-content .wp-block-gallery,





.single-post .entry-content .wp-block-image { max-width: 1180px; width: 100%; }











.widget-area {





    background: var(--sbc-light-2);





    border: 1px solid var(--sbc-border);





    border-radius: 18px;





    padding: 24px;





    box-shadow: 0 8px 20px rgba(12,157,170,.08);





}











.widget { margin-bottom: 28px; }





.widget:last-child { margin-bottom: 0; }





.widget-title {





    color:#033e4f;





    font-family: Arial, Helvetica, sans-serif;





    font-size: 18px;





    margin: 0 0 12px;





    padding-bottom: 8px;





    border-bottom: 2px solid var(--sbc-border);





}





.widget ul { margin: 0; padding-left: 18px; }











button,





input[type="submit"],





.wp-block-button__link,





.sbc-button {





    background: var(--sbc-dark) !important;





    color: #fff !important;





    border: 0;





    border-radius: 999px;





    padding: 11px 20px;





    text-decoration: none;





    font-family: Arial, Helvetica, sans-serif;





    font-weight: 700;





}





button:hover,





input[type="submit"]:hover,





.wp-block-button__link:hover,





.sbc-button:hover { background: var(--sbc-dark-hover) !important; }











.sbc-card h2 a { color:#033e4f !important; }





.sbc-card h2 a:hover { color:#033e4f !important; }











.post-navigation,





.posts-navigation,





.navigation.post-navigation { display: none !important; }











.site-footer {





    background: var(--sbc-dark);





    color: #fff;





    padding: 28px 44px;





    font-family: Arial, Helvetica, sans-serif;





    font-size: 14px;





}





.site-footer a { color:#033e4f; }











.alignwide { max-width: 1180px; }





.alignfull { width: 100%; max-width: none; }











@media (max-width: 1100px) {





    .site-title {





        white-space: normal;





        font-size: clamp(28px, 4.6vw, 46px);





    }





}











@media (max-width: 900px) {





    .header-bottom-row {





        padding-left: 0;





        flex-direction: column;





        align-items: flex-start;





        gap: 12px;





    }





    .main-navigation { margin-left: 0; width: 100%; }





    .main-navigation ul { justify-content: flex-start; }





    .page-layout { grid-template-columns: 1fr; }





    .widget-area { margin-top: 20px; }





}











@media (max-width: 640px) {





    .site-header,





    .site-content,





    .site-footer { padding-left: 20px; padding-right: 20px; }





    .header-brand-row { align-items: flex-start; }





    .custom-logo { max-height: 58px; }





    body { font-size: 16px; }





}

















/* Version 3.1.1 - Added jAlbum thumbnails to the Recent Posts sidebar widget */





body { background: var(--sbc-dark); }





.site,





.site-header,





.site-content,





.site-main,





.content-area,





.entry-header,





.entry-content,





.entry-footer {





    background: var(--sbc-light);





}





.widget-area,





.widget {





    background: var(--sbc-light-2);





}





.sbc-card {





    background: #ffffff !important;





}





h1, h2, h3, h4, h5, h6,





.entry-title,





.entry-title a,





.site-title,





.site-title a,





.widget-title {





    color:#033e4f;





}





button,





input[type="submit"],





.wp-block-button__link,





.sbc-button {





    background: var(--sbc-dark) !important;





    color: #ffffff !important;





}





button:hover,





input[type="submit"]:hover,





.wp-block-button__link:hover,





.sbc-button:hover {





    background: var(--sbc-dark-hover) !important;





}











/* Single post layout */





.single-post-main {





	width: 100%;





	max-width: 1200px;





	margin: 0 auto;





	padding: 30px;





}











.single-post-article {





	width: 100%;





	max-width: none;





}











.single-post-header {





	margin-bottom: 25px;





}











.single-post-title {





	margin: 0;





	font-size: 2.25rem;





	line-height: 1.2;





}











.single-post-featured-image {





	margin-bottom: 25px;





}











.single-post-featured-image img {





	display: block;





	width: 100%;





	height: auto;





}











.single-post-content {





	display: block;





	width: 100%;





	max-width: none;





	font-size: 1.1rem;





	line-height: 1.7;





}











.single-post-content::after {





	display: table;





	clear: both;





	content: "";





}











.single-post-content iframe {





	display: block;





	width: 100%;





	max-width: 100%;





	border: 0;





}

















/* Full-width jAlbum page template */





.page-template-page-jalbum .site {





    width: 100%;





    max-width: none;





}











.page-template-page-jalbum .site-content {





    width: 100%;





    max-width: none !important;





    margin-left: 0 !important;





    margin-right: 0 !important;





    padding: 28px 0 0 !important;





}











.sbc-jalbum-page,





.sbc-jalbum-page-article,





.sbc-jalbum-page-content {





    width: 100% !important;





    max-width: none !important;





    margin-left: 0 !important;





    margin-right: 0 !important;





    padding-left: 0 !important;





    padding-right: 0 !important;





}











.sbc-jalbum-page-header {





    max-width: 1500px;





    margin-left: auto;





    margin-right: auto;





}











.sbc-jalbum-page-content iframe {





    display: block;





    width: 100% !important;





    max-width: none !important;





    margin: 0 !important;





    padding: 0 !important;





    min-height: 850px;





    border: 0;





}











.sbc-jalbum-page-content > .sbc-jalbum-editable-title,





.sbc-jalbum-page-content > .sbc-jalbum-created-date,





.sbc-jalbum-page-content > .sbc-jalbum-enlarge-heading,





.sbc-jalbum-page-content > .sbc-jalbum-viewing-instructions {





    width: calc(100% - 48px);





    max-width: 1500px;





    margin-left: auto !important;





    margin-right: auto !important;





}











@media (max-width: 640px) {





    .page-template-page-jalbum .site-content {





        padding-top: 18px !important;





    }











    .sbc-jalbum-page-content > .sbc-jalbum-editable-title,





    .sbc-jalbum-page-content > .sbc-jalbum-created-date,





    .sbc-jalbum-page-content > .sbc-jalbum-enlarge-heading,





    .sbc-jalbum-page-content > .sbc-jalbum-viewing-instructions {





        width: calc(100% - 24px);





    }











    .sbc-jalbum-page-content iframe {





        min-height: 700px;





    }





}

















/* =====================================================





   Sonata Bay Home Page





   ===================================================== */





.home .site-content {





    padding: 0;





}











.sbc-home-hero {





    min-height: 310px;





    background-size: cover;





    background-position: center;





    display: flex;





    align-items: flex-end;





    justify-content: center;





    position: relative;





    border-bottom: 6px solid var(--sbc-gold);





}











.sbc-home-hero-inner {





    width: min(1180px, calc(100% - 48px));





    margin: 0 auto 28px;





    padding: 24px 30px;





    background: rgba(12,157,170,.90);





    border: 1px solid rgba(255,255,255,.30);





    border-radius: 18px;





    text-align: center;





    box-shadow: 0 12px 30px rgba(0,0,0,.24);





}











.sbc-home-hero h1 {





    margin: 0;





    color: #fff;





    font-size: clamp(34px, 5vw, 62px);





    line-height: 1.05;





    text-shadow: 0 2px 3px rgba(0,0,0,.35);





}











.sbc-home-hero p {





    margin: 8px 0 0;





    color:#033e4f;





    font-size: clamp(18px, 2.2vw, 27px);





    font-style: italic;





}











.sbc-home-welcome,





.sbc-home-about,





.sbc-home-features,





.sbc-home-contact {





    padding: 58px 44px;





}











.sbc-home-about,





.sbc-home-contact {





    background: var(--sbc-light-2);





}











.sbc-home-section-heading {





    max-width: 850px;





    margin: 0 auto 30px;





    text-align: center;





}











.sbc-home-section-heading.left {





    text-align: left;





    margin-left: 0;





}











.sbc-eyebrow {





    display: inline-block;





    color:#033e4f;





    font-family: Arial, Helvetica, sans-serif;





    font-size: 13px;





    font-weight: 800;





    letter-spacing: .11em;





    text-transform: uppercase;





    margin-bottom: 8px;





}











.sbc-home-section-heading h2,





.sbc-home-contact h2 {





    margin: 0;





    color:#033e4f;





    font-size: clamp(30px, 4vw, 48px);





    line-height: 1.12;





}











.sbc-home-two-column {





    max-width: 1180px;





    margin: 0 auto;





    display: grid;





    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);





    gap: 48px;





    align-items: center;





}











.sbc-home-two-column-reverse {





    grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr);





}











.sbc-home-copy {





    font-size: 18px;





}











.sbc-home-copy p:last-child {





    margin-bottom: 0;





}











.sbc-home-photo-card {





    border-radius: 22px;





    overflow: hidden;





    border: 5px solid #fff;





    box-shadow: 0 14px 34px rgba(12,157,170,.18);





    outline: 2px solid var(--sbc-gold);





}











.sbc-home-photo-card img {





    display: block;





    width: 100%;





    aspect-ratio: 4 / 3;





    object-fit: cover;





}











.sbc-feature-grid {





    max-width: 1180px;





    margin: 0 auto;





    display: grid;





    grid-template-columns: repeat(3, minmax(0, 1fr));





    gap: 16px;





}











.sbc-feature-card {





    display: flex;





    gap: 12px;





    align-items: center;





    min-height: 74px;





    background: #fff;





    border: 1px solid var(--sbc-border);





    border-bottom: 4px solid var(--sbc-gold);





    border-radius: 14px;





    padding: 16px 18px;





    color:#033e4f;





    font-family: Arial, Helvetica, sans-serif;





    font-weight: 700;





    box-shadow: 0 7px 18px rgba(12,157,170,.08);





}











.sbc-feature-mark {





    color:#033e4f;





    flex: 0 0 auto;





}











.sbc-home-contact-card {





    max-width: 1060px;





    margin: 0 auto;





    padding: 34px;





    display: grid;





    grid-template-columns: 1fr 1fr;





    gap: 42px;





    background: #fff;





    border: 1px solid var(--sbc-border);





    border-top: 6px solid var(--sbc-gold);





    border-radius: 20px;





    box-shadow: 0 12px 30px rgba(12,157,170,.10);





}











.sbc-hours {





    padding-left: 36px;





    border-left: 1px solid var(--sbc-border);





}











.sbc-hours h3 {





    color:#033e4f;





    margin: 0 0 4px;





    font-size: 19px;





}











.sbc-hours p {





    margin: 0 0 18px;





}











@media (max-width: 900px) {





    .sbc-home-two-column,





    .sbc-home-two-column-reverse,





    .sbc-home-contact-card {





        grid-template-columns: 1fr;





    }





    .sbc-feature-grid {





        grid-template-columns: repeat(2, minmax(0, 1fr));





    }





    .sbc-hours {





        padding-left: 0;





        border-left: 0;





        border-top: 1px solid var(--sbc-border);





        padding-top: 28px;





    }





}











@media (max-width: 640px) {





    .sbc-home-hero {





        min-height: 250px;





    }





    .sbc-home-hero-inner {





        width: calc(100% - 28px);





        padding: 18px;





        margin-bottom: 18px;





    }





    .sbc-home-welcome,





    .sbc-home-about,





    .sbc-home-features,





    .sbc-home-contact {





        padding: 42px 20px;





    }





    .sbc-feature-grid {





        grid-template-columns: 1fr;





    }





    .sbc-home-contact-card {





        padding: 24px;





    }





}

















/* Editable Gutenberg home page */





.sbc-editable-home,





.sbc-home-editor-content { margin: 0; padding: 0; }





.sbc-home-editor-content > * { margin-top: 0; margin-bottom: 0; }





.sbc-home-two-column.wp-block-columns,





.sbc-home-contact-card.wp-block-columns,





.sbc-feature-grid.wp-block-columns { display: grid; }





.sbc-home-two-column.wp-block-columns { grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); }





.sbc-home-two-column-reverse.wp-block-columns { grid-template-columns: minmax(320px,.95fr) minmax(0,1.05fr); }





.sbc-home-contact-card.wp-block-columns { grid-template-columns: 1fr 1fr; }





.sbc-feature-grid.wp-block-columns { grid-template-columns: repeat(3,minmax(0,1fr)); }





.sbc-feature-grid ul { margin: 0; padding: 0; list-style: none; }





.sbc-feature-grid li { background:#fff; border:1px solid var(--sbc-border); border-bottom:4px solid var(--sbc-gold); border-radius:14px; padding:16px 18px; margin:0 0 16px; color:#033e4f; font-family:Arial,Helvetica,sans-serif; font-weight:700; box-shadow:0 7px 18px rgba(12,157,170,.08); }





.sbc-feature-grid li::before { content:'â—†'; color:#033e4f; margin-right:10px; }





.wp-block-button.sbc-button .wp-block-button__link { background:var(--sbc-dark); color:#fff; border-radius:8px; }





.wp-block-button.sbc-button .wp-block-button__link:hover { background:var(--sbc-dark-hover); }





@media (max-width:900px){





 .sbc-home-two-column.wp-block-columns,.sbc-home-two-column-reverse.wp-block-columns,.sbc-home-contact-card.wp-block-columns{grid-template-columns:1fr;}





 .sbc-feature-grid.wp-block-columns{grid-template-columns:repeat(2,minmax(0,1fr));}





}





@media (max-width:640px){.sbc-feature-grid.wp-block-columns{grid-template-columns:1fr;}}

















/* v1.1.2 - Sonata Bay banner on every page */





.site-header {





    padding: 0;





    background: var(--sbc-light);





    border-bottom: 5px solid var(--sbc-gold);





}





.sbc-site-banner { width: 100%; line-height: 0; background: var(--sbc-dark); }





.sbc-site-banner a, .sbc-site-banner img { display: block; width: 100%; }





.sbc-site-banner img { height: auto; object-fit: cover; }











.site-header > .main-navigation {





    margin: 0;





    width: 100%;





    background: var(--sbc-dark);





    padding: 0 24px;





}





.site-header > .main-navigation ul { justify-content: center; gap: 0; }





.site-header > .main-navigation a {





    color: #fff;





    border-radius: 0;





    padding: 13px 16px;





}





.site-header > .main-navigation a:hover,





.site-header > .main-navigation .current-menu-item > a,





.site-header > .main-navigation .current_page_item > a {





    background: var(--sbc-gold);





    color:#033e4f;





}





@media (max-width: 900px) {





    .site-header > .main-navigation { margin-left: 0; padding: 0 12px; }





    .site-header > .main-navigation ul { justify-content: center; }





}





@media (max-width: 640px) {





    .site-header { padding-left: 0; padding-right: 0; }





    .site-header > .main-navigation a { padding: 10px 11px; font-size: 14px; }





}

















/* v1.1.3 - Selectable page templates */





.sbc-page-layout {





    width: 100%;





    margin: 0 auto;





}











.sbc-page-full-width .sbc-main-content {





    width: 100%;





    max-width: none;





}











/* Full Width means the complete content canvas, including Wide block groups. */





.page-template-template-full-width .sbc-page-layout,





.page-template-template-full-width .sbc-main-content,





.page-template-template-full-width .entry-content,





.page-template-template-full-width .entry-content > .alignwide,





.page-template-template-full-width .entry-content > .alignfull,





.home .sbc-page-full-width,





.home .sbc-page-full-width .sbc-main-content,





.home .sbc-page-full-width .entry-content,





.home .sbc-page-full-width .entry-content > .alignwide,





.home .sbc-page-full-width .entry-content > .alignfull {





    width: 100% !important;





    max-width: none !important;





    margin-left: 0 !important;





    margin-right: 0 !important;





}











/* Imported homepage sections sit inside the editable sbc-home-welcome Group. */





.page-template-template-full-width .entry-content .alignwide,





.page-template-template-full-width .entry-content .alignfull,





.home .sbc-page-full-width .entry-content .alignwide,





.home .sbc-page-full-width .entry-content .alignfull,





.home .sbc-home-welcome,





.home .sbc-home-welcome > .wp-block-group__inner-container {





    width: 100% !important;





    max-width: none !important;





    margin-left: 0 !important;





    margin-right: 0 !important;





}











.sbc-page-with-sidebar {





    display: grid;





    grid-template-columns: minmax(0, 1fr) 320px;





    gap: 30px;





    align-items: start;





}











.sbc-page-with-sidebar .sbc-main-content {





    min-width: 0;





}











.sbc-page-with-sidebar .sbc-sidebar {





    min-width: 0;





}











@media (max-width: 900px) {





    .sbc-page-with-sidebar {





        grid-template-columns: 1fr;





    }











    .sbc-page-with-sidebar .sbc-sidebar {





        margin-top: 20px;





    }





}











/* v1.1.4 - Sonata Bay navigation */





.site-header > .main-navigation { background: var(--sbc-dark); }











.site-header > .main-navigation a {





    color:#033e4f;





    font-weight: 700;





    transition: background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;





}











.site-header > .main-navigation a:hover,





.site-header > .main-navigation a:focus {





    background: var(--sbc-gold);





    color:#033e4f;





    transform: translateY(-2px);





    box-shadow: 0 3px 0 rgba(0,0,0,.18);





}











.site-header > .main-navigation .current-menu-item > a,





.site-header > .main-navigation .current_page_item > a,





.site-header > .main-navigation .current-menu-ancestor > a {





    background: var(--sbc-gold);





    color:#033e4f;





}











.site-header > .main-navigation .sub-menu {





    background: var(--sbc-dark);





    border-top: 3px solid var(--sbc-gold);





}











.site-header > .main-navigation .sub-menu a { color:#033e4f; }











.site-header > .main-navigation .sub-menu a:hover,





.site-header > .main-navigation .sub-menu a:focus {





    background: var(--sbc-gold);





    color:#033e4f;





}











/* v1.1.5 - Tighter Community Features cards on the home page */





.home .sbc-feature-card,





.home .community-feature,





.home .community-features > *,





.home .wp-block-columns.community-features .wp-block-column {





    padding: 12px 14px;





}











.home .community-features {





    gap: 14px;





}

















/* v1.2.1 - Restore Sonata Bay site banner above navigation */





.site-header {





    padding: 0 !important;





    background: #fff;





    border-bottom: 5px solid var(--sbc-gold);





}





.sbc-site-banner { display:block; width:100%; margin:0; padding:0; line-height:0; overflow:hidden; background:var(--sbc-dark); }





.sbc-site-banner a { display:block; width:100%; margin:0; padding:0; }





.sbc-site-banner img { display:block; width:100%; max-width:100%; height:auto; margin:0; padding:0; }





.site-header > .main-navigation { width:100%; margin:0; padding:0 24px; background:var(--sbc-dark); }





.site-header > .main-navigation ul { justify-content:center; }





.site-header > .main-navigation a { color:#033e4f; font-weight:700; }





.site-header > .main-navigation a:hover,





.site-header > .main-navigation a:focus { background:var(--sbc-gold); color:#033e4f; }





@media (max-width:640px) { .site-header > .main-navigation { padding-left:8px; padding-right:8px; } }

















/* =====================================================





   v1.3.0 - Upcoming Events





   ===================================================== */











.sbc-event-single {





    width: 100%;





    text-align: center;





}











.sbc-event-single-date {





    margin: -4px 0 24px;





    color:#033e4f;





    font-family: Arial, Helvetica, sans-serif;





    font-size: clamp(19px, 2vw, 26px);





    font-weight: 700;





}











.sbc-event-single-image-wrap {





    width: 90%;





    margin: 0 auto 30px;





    padding: 8px;





    background: #fff;





    border: 3px solid var(--sbc-gold);





    border-radius: 14px;





    box-shadow: 0 12px 30px rgba(0, 0, 0, .22);





}











.sbc-event-single-image {





    display: block;





    width: 100%;





    height: auto;





    border-radius: 8px;





}











.sbc-upcoming-events-grid {





    display: grid;





    grid-template-columns: repeat(3, minmax(0, 1fr));





    gap: 24px;





    margin: 30px 0;





}











.sbc-event-card {





    margin: 0;





    overflow: hidden;





    background: #fff;





    border: 1px solid var(--sbc-border);





    border-bottom: 5px solid var(--sbc-gold);





    border-radius: 16px;





    box-shadow: 0 7px 20px rgba(12,157,170,.13);





    transition: transform .2s ease, box-shadow .2s ease;





}











.sbc-event-card:hover {





    transform: translateY(-4px);





    box-shadow: 0 13px 28px rgba(12,157,170,.20);





}











.sbc-event-card-link {





    display: block;





    height: 100%;





    color: inherit;





    text-decoration: none;





}











.sbc-event-card-image-wrap {





    overflow: hidden;





    background: var(--sbc-light-2);





    aspect-ratio: 4 / 3;





}











.sbc-event-card-image {





    display: block;





    width: 100%;





    height: 100%;





    object-fit: cover;





    transition: transform .25s ease;





}











.sbc-event-card:hover .sbc-event-card-image {





    transform: scale(1.025);





}











.sbc-event-card-body {





    padding: 18px 20px 20px;





}











.sbc-event-card-title {





    margin: 0 0 8px;





    color:#033e4f;





    font-size: 23px;





    line-height: 1.2;





}











.sbc-event-card-date {





    color: #555;





    font-family: Arial, Helvetica, sans-serif;





    font-size: 16px;





    font-weight: 700;





}











.sbc-no-upcoming-events {





    margin: 28px 0;





    padding: 22px;





    background: var(--sbc-light-2);





    border-left: 5px solid var(--sbc-gold);





    border-radius: 8px;





}











@media (max-width: 900px) {





    .sbc-upcoming-events-grid {





        grid-template-columns: repeat(2, minmax(0, 1fr));





    }





}











@media (max-width: 600px) {





    .sbc-event-single-image-wrap {





        width: 100%;





    }











    .sbc-upcoming-events-grid {





        grid-template-columns: 1fr;





    }





}

















/* =====================================================





   v1.3.1 - Post sidebar + larger Recent Posts





   ===================================================== */











.sbc-single-post-layout {





    display: grid;





    grid-template-columns: minmax(0, 1fr) 320px;





    gap: 30px;





    align-items: start;





}











.sbc-single-post-layout .sbc-main-content {





    min-width: 0;





}











.sbc-single-post-layout .sbc-sidebar {





    min-width: 0;





}











/* Larger Recent Posts links in the sidebar */





.sbc-sidebar .widget_recent_entries ul,





.sbc-sidebar .wp-block-latest-posts {





    margin: 0;





    padding-left: 0;





    list-style: none;





}











.sbc-sidebar .widget_recent_entries li,





.sbc-sidebar .wp-block-latest-posts li {





    margin: 0 0 12px;





}











.sbc-sidebar .widget_recent_entries a,





.sbc-sidebar .wp-block-latest-posts a {





    font-size: 20px;





    line-height: 1.35;





    font-weight: 700;





    color:#033e4f;





    text-decoration: none;





}











.sbc-sidebar .widget_recent_entries a:hover,





.sbc-sidebar .widget_recent_entries a:focus,





.sbc-sidebar .wp-block-latest-posts a:hover,





.sbc-sidebar .wp-block-latest-posts a:focus {





    color:#033e4f;





    text-decoration: underline;





}











@media (max-width: 900px) {





    .sbc-single-post-layout {





        grid-template-columns: 1fr;





    }











    .sbc-single-post-layout .sbc-sidebar {





        margin-top: 24px;





    }





}

















/* =====================================================





   v1.3.2 - Upcoming Event cards + consistent sidebars





   ===================================================== */











/* Compact Upcoming Events cards: graphic + title + date */





.sbc-upcoming-events-grid {





    grid-template-columns: repeat(3, minmax(0, 1fr));





    gap: 18px;





}











.sbc-event-card {





    border: 1px solid var(--sbc-border);





    border-left: 5px solid var(--sbc-gold);





    border-bottom: 1px solid var(--sbc-border);





    border-radius: 12px;





    box-shadow: 0 5px 14px rgba(12,157,170,.12);





    overflow: hidden;





}











.sbc-event-card-link {





    display: flex;





    align-items: center;





    gap: 16px;





    min-height: 118px;





    padding: 16px 18px;





}











.sbc-event-card-icon {





    flex: 0 0 62px;





    width: 62px;





    height: 62px;





    display: grid;





    place-items: center;





    border-radius: 50%;





    background: var(--sbc-light-2);





    border: 2px solid var(--sbc-gold);





}











.sbc-event-card-icon svg {





    width: 38px;





    height: 38px;





    fill: none;





    stroke: var(--sbc-dark);





    stroke-width: 3;





    stroke-linecap: round;





    stroke-linejoin: round;





}











.sbc-event-card-body {





    padding: 0;





    min-width: 0;





}











.sbc-event-card-title {





    margin: 0 0 7px;





    font-size: 21px;





    line-height: 1.22;





}











.sbc-event-card-date {





    font-size: 16px;





    font-weight: 700;





    color: #555;





}











/* Retire the old card-image area on the Upcoming Events page. */





.sbc-event-card-image-wrap,





.sbc-event-card-image {





    display: none !important;





}











/* Make Recent Posts larger everywhere a sidebar/widget area is used. */





.widget_recent_entries a,





.widget_recent_entries li a,





.wp-block-latest-posts a,





.wp-block-latest-posts__post-title,





.widget-area .wp-block-latest-posts a,





.sidebar .wp-block-latest-posts a,





.sbc-sidebar .wp-block-latest-posts a,





.sbc-sidebar .widget_recent_entries a {





    font-size: 20px !important;





    line-height: 1.35 !important;





    font-weight: 700 !important;





}











/* Give all page/post sidebars the same boxed treatment. */





.sbc-sidebar > .widget-area,





.sbc-sidebar .widget,





.sbc-sidebar .wp-block-group,





.sbc-page-with-sidebar > .sbc-sidebar,





.sbc-single-post-layout > .sbc-sidebar {





    box-sizing: border-box;





}











.sbc-page-with-sidebar > .sbc-sidebar,





.sbc-single-post-layout > .sbc-sidebar {





    align-self: start;





    margin-top: 0;





    padding: 20px;





    background: #fff;





    border: 1px solid var(--sbc-border);





    border-top: 5px solid var(--sbc-gold);





    border-radius: 12px;





    box-shadow: 0 6px 18px rgba(12,157,170,.12);





}











/* Home page sidebar should behave like the regular sidebar template. */





.home .sbc-page-with-sidebar {





    align-items: start;





}











.home .sbc-page-with-sidebar > .sbc-sidebar {





    position: static;





    top: auto;





    float: none;





    margin-top: 0;





    padding: 20px;





    background: #fff;





    border: 1px solid var(--sbc-border);





    border-top: 5px solid var(--sbc-gold);





    border-radius: 12px;





    box-shadow: 0 6px 18px rgba(12,157,170,.12);





}











/* Keep spacing consistent between widgets in boxed sidebars. */





.sbc-sidebar .widget + .widget,





.sbc-sidebar .wp-block-group + .wp-block-group {





    margin-top: 22px;





}











@media (max-width: 900px) {





    .sbc-upcoming-events-grid {





        grid-template-columns: repeat(2, minmax(0, 1fr));





    }





}











@media (max-width: 600px) {





    .sbc-upcoming-events-grid {





        grid-template-columns: 1fr;





    }











    .sbc-event-card-link {





        min-height: 0;





    }





}

















/* v1.3.3 - Home page Welcome heading */





.home .sbc-home-hero h1,





.home .sbc-home-welcome h1,





.home h1.welcome-title,





.home .welcome-title,





.home .wp-block-cover h1:first-child,





.home .entry-content > h1:first-child {





    font-family: inherit;





    font-weight: inherit;





    line-height: 1.15;





    font-size: calc(2.2rem + 4px);





}

















/* v1.3.4 - Bold Home welcome heading */





.home .sbc-home-hero h1,





.home .sbc-home-welcome h1,





.home h1.welcome-title,





.home .welcome-title,





.home .wp-block-cover h1:first-child,





.home .entry-content > h1:first-child {





    font-weight: 700 !important;





}











/* =====================================================





   v1.3.5 - Managed jAlbum Photo Galleries





   ===================================================== */





.sbc-jalbum-gallery-grid {





    display: grid;





    grid-template-columns: repeat(3, minmax(0, 1fr));





    gap: 24px;





    margin: 28px 0;





    align-items: stretch;





}











.sbc-jalbum-gallery-card {





    margin: 0;





    overflow: hidden;





    background: var(--sbc-light-2);





    border: 2px solid var(--sbc-dark);





    border-radius: 12px;





    box-shadow: 0 4px 12px rgba(0,0,0,.14);





    transition: transform .2s ease, box-shadow .2s ease;





}











.sbc-jalbum-gallery-card:hover {





    transform: translateY(-3px);





    box-shadow: 0 7px 17px rgba(0,0,0,.2);





}











.sbc-jalbum-gallery-card-link {





    display: flex;





    height: 100%;





    flex-direction: column;





    color: inherit;





    text-decoration: none;





}











.sbc-jalbum-gallery-card-image-wrap {





    display: flex;





    justify-content: center;





    align-items: center;





    overflow: hidden;





    padding: 18px 12px;





    background: #d1f7fa;





    border-bottom: 4px solid var(--sbc-gold);





}











.sbc-jalbum-gallery-card-image {





    width: 60%;





    height: auto;





    max-height: 300px;





    display: block;





    object-fit: contain;





    transition: transform .25s ease;





}











.sbc-jalbum-gallery-card:hover .sbc-jalbum-gallery-card-image {





    transform: scale(1.025);





}











.sbc-jalbum-gallery-card-body {





    padding: 16px 18px 18px;





}











.sbc-jalbum-gallery-card-title {





    margin: 0 0 7px;





    color:#033e4f;





    font-size: 22px;





    line-height: 1.25;





}











.sbc-jalbum-gallery-card-date,





.sbc-jalbum-created-date {





    color: var(--sbc-muted);





    font-weight: 600;





    text-align: center;





}











.sbc-jalbum-editable-title,





.sbc-jalbum-enlarge-heading,





.sbc-jalbum-viewing-instructions {





    text-align: center;





}











.sbc-managed-jalbum-frame {





    display: block;





    width: 100%;





    min-height: 850px;





    border: 0;





}











@media (max-width: 900px) {





    .sbc-jalbum-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }





}











@media (max-width: 600px) {





    .sbc-jalbum-gallery-grid { grid-template-columns: 1fr; }





    .sbc-managed-jalbum-frame { min-height: 700px; }





}











/* =====================================================





   v1.3.13 - Editable automatic News page grid





   ===================================================== */





.sbc-news-grid {





    display: grid !important;





    grid-template-columns: repeat(2, minmax(0, 1fr));





    column-gap: 30px;





    row-gap: 30px;





    align-items: stretch;





    margin: 28px 0 36px;





}











.sbc-news-grid > .sbc-news-card {





    margin: 0;





    height: 100%;





    background: #fff;





    border: 2px solid var(--sbc-dark);





    border-radius: 12px;





    box-shadow: 0 4px 12px rgba(0,0,0,.12);





    overflow: hidden;





}











.sbc-news-card-link {





    display: flex;





    align-items: center;





    gap: 18px;





    min-height: 138px;





    height: 100%;





    padding: 24px;





    color: inherit;





    text-decoration: none;





}











.sbc-news-card-link:hover,





.sbc-news-card-link:focus {





    color: inherit;





    text-decoration: none;





}











.sbc-news-card-icon {





    flex: 0 0 auto;





    display: flex;





    align-items: center;





    justify-content: center;





    width: 52px;





    height: 52px;





    border-radius: 50%;





    background: var(--sbc-dark);





    border: 3px solid var(--sbc-gold);





    font-size: 25px;





    line-height: 1;





    box-shadow: 0 3px 8px rgba(0,0,0,.16);





}











.sbc-news-card-copy {





    display: flex;





    min-width: 0;





    flex-direction: column;





    gap: 8px;





}











.sbc-news-card-title {





    color:#033e4f;





    font-size: 1.25rem;





    font-weight: 700;





    line-height: 1.25;





}











.sbc-news-card-date {





    color: var(--sbc-muted);





    font-size: .95rem;





    font-weight: 600;





}











@media (max-width: 700px) {





    .sbc-news-grid { grid-template-columns: 1fr; }





}

















/* =====================================================





   v1.3.16 - Force News card presentation





   ===================================================== */





body.page-id-35 .sbc-news-grid,





.sbc-news-grid {





    column-gap: 32px !important;





    row-gap: 32px !important;





}





body.page-id-35 .sbc-news-grid > .sbc-news-card,





.sbc-news-grid > .sbc-news-card {





    background: #ffffff !important;





    border: 2px solid #0c9daa !important;





    border-radius: 12px !important;





    box-shadow: 0 5px 14px rgba(0,0,0,.18) !important;





    overflow: hidden !important;





}





body.page-id-35 .sbc-news-card-link,





.sbc-news-card-link {





    padding: 24px !important;





    gap: 18px !important;





}





body.page-id-35 .sbc-news-card-icon,





.sbc-news-card-icon {





    width: 44px !important;





    height: 44px !important;





    min-width: 44px !important;





    font-size: 22px !important;





    background: transparent !important;





    border: 0 !important;





    box-shadow: none !important;





}

















/* v1.3.19 - Media Library News graphic */





.sbc-news-card-media {





    display: block;





    height: 60px;





    width: auto;





    max-width: 34%;





    object-fit: contain;





    flex: 0 0 auto;





}





@media (max-width:700px) {





    .sbc-news-card-media { height: 52px; max-width: 30%; }





}











/* v1.0.11 - Collapsible small-screen navigation with a labeled Menu button. */





.menu-toggle {





    display: none;





    margin: 8px auto;





    padding: 9px 24px;





    border: 2px solid #d1f7fa;





    border-radius: 7px;





    background: #d1f7fa;





    color:#033e4f;





    font: 700 17px/1.2 Arial, Helvetica, sans-serif;





    cursor: pointer;





}





.menu-toggle:hover,





.menu-toggle:focus {





    background: #fff;





    color:#033e4f;





    outline: 2px solid #fff;





    outline-offset: 2px;





}





@media (max-width: 760px) {





    .site-header > .main-navigation { padding: 0 10px 8px; }





    .menu-toggle { display: block; }





    .site-header > .main-navigation #primary-menu {





        display: none;





        width: 100%;





        flex-direction: column;





        align-items: stretch;





        justify-content: flex-start;





        gap: 0;





        padding: 4px 0 8px;





    }





    .site-header > .main-navigation.is-open #primary-menu { display: flex; }





    .site-header > .main-navigation #primary-menu > li { width: 100%; }





    .site-header > .main-navigation #primary-menu > li > a {





        width: 100%;





        padding: 11px 14px;





        text-align: center;





    }





    .site-header > .main-navigation .sub-menu {





        position: static;





        display: none;





        width: 100%;





        margin: 0;





        padding: 0 0 4px;





        border-top: 0;





        box-shadow: none;





    }





    .site-header > .main-navigation .submenu-open > .sub-menu {





        display: flex;





        flex-direction: column;





        align-items: stretch;





    }





}











/* v1.0.12 - Accessible dropdown submenus. */





@media (min-width: 761px) {





    .site-header > .main-navigation #primary-menu > .menu-item-has-children {





        padding-right: 2px;





    }





    .site-header > .main-navigation .sub-menu {





        position: absolute;





        z-index: 9999;





        top: 100%;





        left: 0;





        display: flex;





        min-width: 230px;





        flex-direction: column;





        align-items: stretch;





        gap: 0;





        margin: 0;





        padding: 0;





        opacity: 0;





        visibility: hidden;





        pointer-events: none;





        transform: translateY(8px);





        box-shadow: 0 8px 18px rgba(0,0,0,.28);





        transition: opacity .18s ease, transform .18s ease, visibility .18s ease;





    }





    .site-header > .main-navigation .sub-menu li {





        width: 100%;





    }





    .site-header > .main-navigation .sub-menu a {





        display: block;





        width: 100%;





        padding: 11px 16px;





        white-space: nowrap;





        text-align: left;





    }





    .site-header > .main-navigation li:hover > .sub-menu,





    .site-header > .main-navigation li:focus-within > .sub-menu {





        opacity: 1;





        visibility: visible;





        pointer-events: auto;





        transform: translateY(0);





    }





    .site-header > .main-navigation .sub-menu .sub-menu {





        top: 0;





        left: 100%;





    }





}











.submenu-toggle {





    display: none;





}











@media (max-width: 760px) {





    .site-header > .main-navigation .menu-item-has-children {





        display: grid;





        grid-template-columns: minmax(0, 1fr) 48px;





    }





    .site-header > .main-navigation .menu-item-has-children > a {





        grid-column: 1;





    }





    .site-header > .main-navigation .submenu-toggle {





        display: block;





        grid-column: 2;





        width: 44px;





        min-height: 42px;





        margin: 2px;





        padding: 0;





        border: 1px solid #d1f7fa;





        border-radius: 5px;





        background: transparent;





        color: #FFFFFF;





        font-size: 22px;





        line-height: 1;





        cursor: pointer;





    }





    .site-header > .main-navigation .submenu-toggle:hover,





    .site-header > .main-navigation .submenu-toggle:focus {





        background: #d1f7fa;





        color:#033e4f;





        outline: 2px solid #FFFFFF;





        outline-offset: 1px;





    }





    .site-header > .main-navigation .submenu-toggle::before {





        content: "â–¾";





    }





    .site-header > .main-navigation .submenu-open > .submenu-toggle::before {





        content: "â–´";





    }





    .site-header > .main-navigation .menu-item-has-children > .sub-menu {





        grid-column: 1 / -1;





    }





}











/* Sonata Bay resident login */





.sby-resident-login{max-width:560px;margin:35px auto;padding:28px;background:#d1f7fa;border:2px solid #8edfe7;border-radius:10px;box-shadow:0 5px 14px rgba(0,0,0,.16)}





.sby-resident-login h2{text-align:center;color:#033e4f;margin-top:0}





.sby-resident-login label{font-weight:700;color:#033e4f}





.sby-resident-login input[type="text"],.sby-resident-login input[type="password"]{width:100%;padding:10px;border:1px solid #888;border-radius:4px}





.sby-resident-login input[type="submit"],.sby-resident-button{display:inline-block;background:#8edfe7;color:#fff!important;border:0;border-radius:5px;padding:10px 18px;text-decoration:none;font-weight:700;cursor:pointer}





.sby-resident-login input[type="submit"]:hover,.sby-resident-button:hover{background:#0c9daa;color:#fff!important}





.sby-resident-logout{background:#666}

















/* v1.0.1 - Sonata Bay editable public home page */





.sby-home-intro,.sby-useful-links{padding:24px 28px;margin:0 0 28px;background:#fff;border:1px solid #d3d3d3;border-radius:8px;box-shadow:0 3px 10px rgba(0,0,0,.08)}





.sby-home-intro h1,.sby-useful-links h2{color:#033e4f}





.sby-home-intro-columns{gap:30px}





.sby-home-intro p{font-size:1.08rem;line-height:1.7}





.sby-home-photo img{width:100%;height:auto;border-radius:7px;box-shadow:0 4px 12px rgba(0,0,0,.18)}





.sby-link-grid{gap:18px}





.sby-link-button .wp-block-button__link{background:#8edfe7;color:#fff;border-radius:6px;font-weight:700;padding:12px 18px}





.sby-link-button .wp-block-button__link:hover{background:#0c9daa;color:#fff}





.home .sbc-sidebar .widget_recent_entries ul{list-style:none;margin:0;padding:0}





.home .sbc-sidebar .widget_recent_entries li{padding:10px 0;border-bottom:1px solid #d2d2d2}





.home .sbc-sidebar .widget_recent_entries a{font-weight:700;color:#033e4f;text-decoration:none}





.home .sbc-sidebar .widget_recent_entries a:hover{color:#033e4f;text-decoration:underline}





@media(max-width:781px){.sby-home-intro,.sby-useful-links{padding:18px}.sby-home-intro-columns,.sby-link-grid{gap:12px}}











/* v1.0.3 - Site width and outer background */





html,





body {





    background-color: #0c9daa !important;





}











.site {





    width: 90% !important;





    max-width: none !important;





    margin-left: auto !important;





    margin-right: auto !important;





}











.site-content {





    padding-left: clamp(32px, 3.5vw, 64px) !important;





    padding-right: clamp(24px, 3vw, 54px) !important;





}











@media (max-width: 900px) {





    .site {





        width: 94% !important;





    }





    .site-content {





        padding-left: 26px !important;





        padding-right: 22px !important;





    }





}











@media (max-width: 640px) {





    .site {





        width: 100% !important;





    }





    .site-content {





        padding-left: 20px !important;





        padding-right: 18px !important;





    }





}

















/* v1.0.9 - Medium-gray dividers and additional sidebar top spacing */





:root {





    --sby-divider-gray: #808080;





}











/* Divider directly below the banner/navigation area */





.site-header {





    border-bottom-color: var(--sby-divider-gray) !important;





}











/* Sidebar top accent/divider */





.sbc-page-with-sidebar > .sbc-sidebar,





.sbc-single-post-layout > .sbc-sidebar,





.home .sbc-page-with-sidebar > .sbc-sidebar {





    border-top-color: var(--sby-divider-gray) !important;





}











/* Add breathing room above the sidebar on desktop */





.sbc-page-with-sidebar > .sbc-sidebar,





.sbc-single-post-layout > .sbc-sidebar,





.home .sbc-page-with-sidebar > .sbc-sidebar {





    margin-top: 24px !important;





}











@media (max-width: 900px) {





    .sbc-page-with-sidebar > .sbc-sidebar,





    .sbc-single-post-layout > .sbc-sidebar,





    .home .sbc-page-with-sidebar > .sbc-sidebar {





        margin-top: 28px !important;





    }





}

















/* v1.0.10 - Editable Home-page Useful Links grid */





.sby-card-grid {





    display: grid !important;





    grid-template-columns: repeat(3, minmax(0, 1fr));





    gap: 24px;





    margin: 24px 0;





}











.sby-card-grid > .wp-block-group {





    box-sizing: border-box;





    min-width: 0;





    height: 100%;





    padding: 22px;





    border: 1px solid #808080;





    border-radius: 8px;





    background: #ffffff;





    box-shadow: 0 3px 10px rgba(0,0,0,.12);





    text-align: center;





}











.sby-card-grid .wp-block-buttons {





    justify-content: center;





}











.sby-card-grid .wp-block-button__link {





    background: #8edfe7;





    color: #ffffff;





}











@media (max-width: 900px) {





    .sby-card-grid {





        grid-template-columns: repeat(2, minmax(0, 1fr));





    }





}











@media (max-width: 600px) {





    .sby-card-grid {





        grid-template-columns: 1fr;





    }





}

















/* v1.0.11 - Force Home Useful Links into a visible card grid */





.entry-content .sby-card-grid,





.site-main .sby-card-grid,





.sby-card-grid {





    display: grid !important;





    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;





    gap: 24px !important;





    align-items: stretch !important;





    width: 100% !important;





    max-width: none !important;





    margin: 24px 0 !important;





}











.entry-content .sby-card-grid > .wp-block-group,





.site-main .sby-card-grid > .wp-block-group,





.sby-card-grid > .wp-block-group,





.sby-card-grid > .sby-link-card {





    display: flex !important;





    flex-direction: column !important;





    justify-content: space-between !important;





    min-width: 0 !important;





    min-height: 150px !important;





    margin: 0 !important;





    padding: 22px !important;





    box-sizing: border-box !important;





    background: #ffffff !important;





    border: 2px solid #808080 !important;





    border-radius: 10px !important;





    box-shadow: 0 4px 10px rgba(0,0,0,.18) !important;





    text-align: center !important;





}











.sby-card-grid .sby-link-card h3,





.sby-card-grid > .wp-block-group h3 {





    margin-top: 0 !important;





    margin-bottom: 18px !important;





    color:#033e4f !important;





}











.sby-card-grid .wp-block-buttons {





    margin-top: auto !important;





    justify-content: center !important;





}











.sby-card-grid .wp-block-button__link {





    background-color: #8edfe7 !important;





    color: #ffffff !important;





    border-radius: 6px !important;





    padding: 10px 22px !important;





    text-decoration: none !important;





}











@media (max-width: 900px) {





    .entry-content .sby-card-grid,





    .site-main .sby-card-grid,





    .sby-card-grid {





        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;





    }





}











@media (max-width: 600px) {





    .entry-content .sby-card-grid,





    .site-main .sby-card-grid,





    .sby-card-grid {





        grid-template-columns: 1fr !important;





    }





}























/* v1.0.12 - Reusable centered block-width utility classes */











.width-20 {





    width: 20% !important;





    max-width: 20% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-30 {





    width: 30% !important;





    max-width: 30% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-40 {





    width: 40% !important;





    max-width: 40% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-50 {





    width: 50% !important;





    max-width: 50% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-60 {





    width: 60% !important;





    max-width: 60% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-70 {





    width: 70% !important;





    max-width: 70% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-80 {





    width: 80% !important;





    max-width: 80% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}











.width-90 {





    width: 90% !important;





    max-width: 90% !important;





    margin-left: auto !important;





    margin-right: auto !important;





    box-sizing: border-box;





}

















@media (max-width: 600px) {





    .width-20, .width-30, .width-40, .width-50,





    .width-60, .width-70, .width-80, .width-90 {





        width: 100% !important;





        max-width: 100% !important;





    }





}

















/* v1.0.13 - Southwind continuous grid spacing */





.southwind-continuous-grid {





    column-gap: 40px !important;





    row-gap: 40px !important;





    gap: 40px !important;





}











/* Make sure Gutenberg's grid children do not add conflicting margins */





.southwind-continuous-grid > .southwind-card {





    margin: 0 !important;





}

















/* v1.0.14 - News/RoboCalls automatic post cards */





.sby-news-grid {





    display:grid;





    grid-template-columns:repeat(2,minmax(0,1fr));





    gap:32px;





    margin:25px 0;





}





.sby-news-card {





    border:2px solid #808080;





    border-radius:10px;





    padding:22px;





    background:#fff;





    box-shadow:0 4px 10px rgba(0,0,0,.14);





}





.sby-news-card img {





    width:100%;





    height:220px;





    object-fit:cover;





    display:block;





    margin:0 0 15px;





}





.sby-news-card h2 { margin-top:0; }





.sby-news-date { font-size:.9em; margin-bottom:12px; }





.sby-news-button {





    display:inline-block;





    background:#8edfe7;





    color:#fff !important;





    padding:10px 18px;





    border-radius:6px;





    text-decoration:none;





    margin-top:10px;





}





@media(max-width:700px){.sby-news-grid{grid-template-columns:1fr;}}











/* v1.0.15 - News card refinements */





.sby-news-card h3.sby-news-title {





    font-size: 1.15rem !important;





    line-height: 1.25;





    margin: 0 0 8px !important;





}





.sby-news-card h3.sby-news-title a {





    color:#033e4f;





    text-decoration: none;





}





.sby-news-date {





    font-weight: 700;





    margin-bottom: 12px;





}











/* v1.0.16 - News title is a distinct small headline above card content */





.sby-news-card .sby-news-title {





    display:block !important;





    width:100% !important;





    font-size:1.15rem !important;





    line-height:1.25 !important;





    font-weight:700 !important;





    margin:0 0 8px 0 !important;





    padding:0 0 7px 0 !important;





    clear:both !important;





}





.sby-news-card .sby-news-date {





    display:block !important;





    width:100% !important;





    clear:both !important;





    margin:0 0 12px 0 !important;





}











/* v1.0.17 - Force News title into its own top row */





.sby-news-card {





    display:flex !important;





    flex-direction:column !important;





    align-items:stretch !important;





}





.sby-news-title {





    order:1 !important;





    display:block !important;





    width:100% !important;





    font-size:18px !important;





    line-height:1.25 !important;





    font-weight:700 !important;





    margin:0 0 8px !important;





}





.sby-news-date { order:2 !important; }





.sby-news-image { order:3 !important; }





.sby-news-excerpt { order:4 !important; }





.sby-news-button { order:5 !important; align-self:flex-start !important; }











/* v1.0.18 - News card title guaranteed visible */





.sby-news-card .sby-news-title,





.sby-news-card .sby-news-title a {





    display:block !important;





    visibility:visible !important;





    opacity:1 !important;





    color:#033e4f !important;





}





.sby-news-card .sby-news-title {





    font-size:18px !important;





    font-weight:700 !important;





    line-height:1.3 !important;





    margin:0 0 8px 0 !important;





    padding:0 !important;





}








/* Dashboard-configurable residents login button color. */


.sby-resident-login .sby-resident-button, .sby-resident-login input[type="submit"] {background-color:var(--sby-login-button,#8edfe7)!important;}





/* Sonata Bay palette: keep dark lettering readable on light/medium surfaces. */


:root { --sonata-light:#d1f7fa; --sonata-medium:#8edfe7; --sonata-dark:#0c9daa; }


#masthead.site-header > .main-navigation #primary-menu a,


.main-navigation button, .site-content .wp-block-button__link,


.site-content .sby-card-grid .wp-block-button__link,


.sby-resident-login .sby-resident-button, .sby-resident-login input[type="submit"],


.site-content .sby-news-button, .site-content .sbf-death-notice-button { color:#08272b !important; }


#masthead.site-header > .main-navigation #primary-menu a:hover,


#masthead.site-header > .main-navigation #primary-menu a:focus,


.sby-link-button .wp-block-button__link:hover { background:#8edfe7 !important; color:#08272b !important; }


.sby-resident-login .sby-resident-logout { background:#d1f7fa !important; }


.sby-news-date, .sbf-death-notice-date { color:#08272b !important; }


/* Compact banner with full-width navigation immediately below it. */


#masthead.site-header { display:block; }


#masthead > .sbc-site-banner { aspect-ratio:10 / 1; }


#masthead > .sbc-site-banner a { height:100%; }


#masthead > .sbc-site-banner img { width:100%; height:100%; object-fit:cover; object-position:center; }


#masthead > #site-navigation { display:flow-root; width:100%; margin:0; border-bottom:3px solid #8edfe7; }


#masthead > #site-navigation ul,


#masthead > #site-navigation li { list-style:none !important; }


#masthead > #site-navigation ul { padding-left:0; }


#masthead > #site-navigation li::marker { content:""; }


#masthead > #site-navigation li::before,


#masthead > #site-navigation li::after { content:none !important; }


@media (min-width:761px) {


    #masthead > #site-navigation #primary-menu { display:flex; flex-direction:row; justify-content:center; }


}



/* v1.0.4 - Activities cards: shared title height and aligned image starts. */
.site-content .sonata-activities-grid { gap:30px !important; }
.site-content .sonata-activities-grid > .wp-block-group {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    background:#ffffff !important;
    min-width:0;
    margin-top:0 !important;
}
.site-content .sonata-activities-grid > .wp-block-group > .wp-block-heading,
.site-content .sonata-activities-grid > .wp-block-group > .wp-block-group__inner-container > .wp-block-heading {
    display:block !important;
    box-sizing:border-box;
    flex:0 0 auto;
    height:var(--sonata-activity-title-height,auto) !important;
    min-height:1.3em !important;
    line-height:1.3 !important;
    margin:0 0 6px !important;
    padding:0 !important;
    text-align:center !important;
    overflow-wrap:anywhere;
}
.site-content .sonata-activities-grid > .wp-block-group > .wp-block-image,
.site-content .sonata-activities-grid > .wp-block-group > .wp-block-group__inner-container > .wp-block-image {
    flex:0 0 auto;
    margin:0 !important;
}
.site-content .sonata-activities-grid > .wp-block-group .wp-block-image img {
    display:block;
    margin-left:auto;
    margin-right:auto;
    max-width:100%;
    height:auto;
}
.site-content .sonata-activities-grid a,
.site-content .sonata-activities-grid a:visited { color:#033e4f !important; }
.site-content .sonata-activities-grid a:hover,
.site-content .sonata-activities-grid a:focus-visible { color:#033e4f !important; }

.site-content .sonata-activities-grid > .wp-block-group > .wp-block-group__inner-container { display:flex !important; flex-direction:column !important; align-items:stretch !important; width:100%; }

/* v1.0.14 - Editable Residents Home cards. */
.site-content .sby-resident-home-grid { display:grid !important; gap:30px !important; }
.sby-resident-home-grid > .sby-resident-home-card { margin:0 !important; min-width:0; text-align:center; }
.sby-resident-home-card .wp-block-image { margin:0 0 18px !important; }
.sby-resident-home-card img { display:block; width:100%; aspect-ratio:1; object-fit:contain; margin:auto; }
.sby-resident-home-card h3 { color:#033e4f !important; line-height:1.3; margin:0 !important; }
.sby-resident-home-card h3 a { color:#033e4f !important; }
@media(max-width:900px){.site-content .sby-resident-home-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
@media(max-width:480px){.site-content .sby-resident-home-grid{grid-template-columns:1fr !important;}}

/* v1.0.15 - Automatic continuous Robo Call card grid. */
.sby-robo-grid { display:grid; grid-template-columns:repeat(var(--sby-robo-columns,3),minmax(0,1fr)); gap:30px; align-items:stretch; }
.sby-robo-card { background:#fff; color:#033e4f; border:2px solid #0c9daa; border-radius:12px; padding:24px; min-width:0; overflow-wrap:anywhere; }
.sby-robo-card h3 { color:#033e4f !important; margin:0 0 12px !important; line-height:1.3; }
.sby-robo-date { margin:0 0 18px; font-size:.95em; }
.sby-robo-image { display:block; max-width:100%; height:auto; margin:0 auto 18px; }
.sby-robo-content audio, .sby-robo-content video, .sby-robo-content iframe { max-width:100%; }
.sby-robo-content .wp-audio-shortcode { width:100% !important; }
@media(max-width:900px){.sby-robo-grid {grid-template-columns:repeat(min(var(--sby-robo-columns,3),2),minmax(0,1fr));}}
@media(max-width:600px){.sby-robo-grid {grid-template-columns:1fr;}}

/* v1.0.17 - Short previews and protected full-message links. */
.sby-robo-card { display:flex; flex-direction:column; }
.sby-robo-read-more-wrap { margin-top:auto; padding-top:16px; }
.site-content a.sby-robo-read-more { display:inline-block; background:#8edfe7; color:#033e4f !important; border:2px solid #0c9daa; border-radius:6px; padding:10px 18px; text-decoration:none; font-weight:bold; }
.site-content a.sby-robo-read-more:hover { background:#d1f7fa; }
.sby-robo-full-message { background:#fff; border:2px solid #0c9daa; border-radius:12px; padding:24px; color:#033e4f; }
.sby-robo-full-message audio,.sby-robo-full-message video,.sby-robo-full-message iframe { max-width:100%; }

/* v1.0.18 - Robo Call messages: sidebar layout and centered 80% content. */
body.sby-robo-single .sbc-main-content > article > .entry-content,
.site-content .sby-robo-full-message {
    width:80%;
    max-width:80%;
    box-sizing:border-box;
    margin-left:auto;
    margin-right:auto;
}

/* v1.0.20 - One continuous Shorelines issue grid. */
.sby-shorelines-grid { display:grid; grid-template-columns:repeat(var(--sby-shorelines-columns,3),minmax(0,1fr)); gap:30px; align-items:stretch; }
.sby-shorelines-card { background:#fff; color:#033e4f; border:2px solid #0c9daa; border-radius:12px; padding:20px; text-align:center; min-width:0; }
.sby-shorelines-card h3 { color:#033e4f !important; font-size:24px; line-height:1.3; min-height:2.6em; margin:0 0 18px !important; }
.sby-shorelines-cover { display:block; }
.sby-shorelines-cover img { display:block; width:100%; height:auto; aspect-ratio:8.5 / 11; object-fit:contain; margin:0 auto; }
.sby-shorelines-card a:focus-visible { outline:3px solid #033e4f; outline-offset:4px; }
@media(max-width:900px){.sby-shorelines-grid {grid-template-columns:repeat(min(var(--sby-shorelines-columns,3),2),minmax(0,1fr));}}
@media(max-width:600px){.sby-shorelines-grid {grid-template-columns:1fr;}}

/* v1.0.21 - Thin black frame on Shorelines cover images. */
.sby-shorelines-cover img { border:1px solid #000; box-sizing:border-box; }
