/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/


/*
some native font families

font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;

font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif;

font-family: ui-rounded, 'Hiragino Maru Gothic ProN', Quicksand, Comfortaa, Manjari, 'Arial Rounded MT', 'Arial Rounded MT Bold', Calibri, source-sans-pro, sans-serif;

https://modernfontstacks.com/

2-3-2025 1150
h1 {
    font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif;
    letter-spacing: -.04em;
  }

h2, h3, h4, h5, h6 {
    font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
}


*/




/*   

* {
  outline: rgba(69, 246, 74, 0.307) solid 1px;
}

*/




--primary-transparent: rgba(0, 102, 204, 0.85);  /* Main Transparency */
--primary-light-transparent: rgba(0, 102, 204, 0.50); /* Lighter transparency */
--primary-dark-transparent: rgba(0, 102, 204, 0.30);  /* Darker transparency */
--primary-ultra-dark-transparent: rgba(0, 102, 204, 0.15); /* Ultra dark transparency */




body {
    font-family: system-ui, sans-serif;
  }

h1 {
font-family: system-ui, sans-serif;
  }

h2, h3, h4, h5, h6 {
font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
}


h5 + ul {
    margin-top: .6em !important; /* Adjust this value to your preference */
}

p + ul {
    margin-top: .6em !important; /* Adjust this value to your preference */
}

ul {
    margin-bottom: 2rem !important; /* Adjust this value to your preference */
}



.default-text-color a {
  color: var(--neutral) !important;

}


/* table every other row color */
table tr.even, table tr.alt, table tr:nth-of-type(even) {
background: #f5f5f5; }


/* menu settings top nav */

.fr-nav-alpha-mmsd {
  font-weight: 500;
  font-kerning: normal;
 /* letter-spacing: -.02em; */
  font-size: clamp(1.25rem, 1.5vw, 2.1rem);
}

.library-txt {
  white-space: nowrap;
}

.cta-tickets > a {
  font-weight: 900;
  --link-color-hover: var(--primary-ultra-light) !important;
  text-decoration: none !important;
  color: #e6f2ff !important;


}


.fr-nav-alpha {
  --link-color: var(--primary) !important;
  --link-color-hover: var(--primary-hover) !important;
  --link-color-active: var(--primary) !important;
  --toggle-gap: .5em !important;
  --sub-item-padding: 1em !important;
}




.donate-link {
  font-weight: 900;
  background-color: #507e00;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  --link-color-hover: var(--primary-ultra-light) !important;

}


.donate-link:hover {
  background-color:#416600;
}

.membership-link {
  font-weight: 900;
  background-color: #005f7f;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  --link-color-hover: var(--primary-ultra-light) !important;

}


.membership-link:hover {
  background-color:#00455c;
}

.volunteer-link {
  font-weight: 900;
  background-color: #e10000;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  --link-color-hover: var(--primary-ultra-light) !important;
}

.volunteer-link:hover {
  background-color:#ab0000;
}



.show-mobile-menu ul.bricks-mobile-menu {
  align-items:  flex-start !important;
}

.show-mobile-menu .bricks-mobile-menu .cta-tickets {
  margin-inline-start: inherit !important;
}




/*   for tab styles - about page, volunteer - others    */

.tab-menu .tab-title.brx-open {
  background-color: #f1c886 !important;
}

.tab-menu .tab-title {
  background-color: #dddedf;
}

/*   for blockquote    */

blockquote {
  border-left-width: 9px;
  font-family: inherit;
  font-style: italic;
  font-size: 1.2em;
  background-color: #f5f5f5;
  margin-left: 3rem;
  margin-right: 3rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  padding-right: 1.5rem;
  box-shadow: 0 .5rem 2.5rem 0 var(--neutral-light-trans-90);
}

/*   for button events page    */
.btn-events {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;

}

/*   for images included within the text as alignright or left, so it works better on mobile    */
.alignright, .alignleft{
  max-width: 45%;
}




/*   gets rid of the margin when doing tables in gutenburg    */
.wp-block-table {
  margin-top: 0px;
  margin-bottom: 0px;
}


/* adds padding to tilte for - [pagelist_ext show_image="1" image_width="450"] */
.page-list-ext .page-list-ext-title {
  padding-top: 10rem;
}



@media (max-width: 991px) {
  .happyfiles-gallery>ul.crop[data-col] {
    grid-template-columns: repeat(1,1fr);
  }
}


/* adds padding to faked western flyer post under special events */
.wp-block-media-text > .wp-block-media-text__content {
  padding-left: 20px !important;
  padding-right: 20px !important;
  padding-top: 15px !important;
}




/* Responsive layout - makes a one column-layout instead of multi-column layout for home screen - things to see, to do, special events */
@media (max-width: 1100px) {
  .fr-feature-romeo-two-plus {
    flex-direction: column !important;
  }
}



/* Responsive layout - makes a two column-layout then one column on happy file gallery */
@media (max-width: 833px) {
  .happyfiles-gallery > ul {
    column-count: 2 !important;
  }
}


@media (max-width: 500px) {
  .happyfiles-gallery > ul {
    column-count: 1 !important;
  }
}

/* END - Responsive layout - makes a two column-layout then one column on happy file gallery */


/* updates to a links for accessibility - March 17 2025 */

/* rich text to H3 which have a links - adds underline */
/* [pagelist_ext class="head-with-link" show_image="1" image_width="450"] */
.head-with-link a {
  text-decoration: underline !important;
}

/* rich text to H3 which have a links - adds a lighter shade on hover */
/* [pagelist_ext class="head-with-link" show_image="1" image_width="450"] */
.head-with-link a:hover {
  color: #4e4e4e !important;
}



/* this removes the underline on a links during hover, but retains a underline in the nav which shows during hover */
a:hover:not(.fr-nav-alpha-mmsd *){
  text-decoration: none !important;
}


/* Adds some margin & padding to password page */
#brx-content .post-password-form {
  margin-top: 10rem;
  margin-bottom: 21rem;
  padding-left: 2rem;
  padding-right: 3rem;
}


/* Adds some margin to h1 on password page */
html body.page-template-default.page.page-id-4271.brx-body.bricks-is-frontend.wp-embed-responsive.cmplz-functional.cmplz-us.cmplz-optout article#brx-content.wordpress.post-4271.page.type-page.status-publish.post-password-required.hentry.category-top-level-page {
  margin-top: 13rem;
  padding-left: 3rem;
}


/* Brings the h4 closer to the ul - used initially of education day/night information/forms pages  */
.ul-closer {
  margin-bottom: -1.8rem;
}





/* https://sdmaritime.local/education/ uses just the center photo during mobile view  */

@media (max-width: 766px) {
#brxe-otskml > figure:nth-child(1) {
  display: none;
}
}

@media (max-width: 766px) {
div.brxe-div:nth-child(3) > figure:nth-child(1) {
  display: none;

}
}


/* remove home and first separator from breadcrumbs  */
.brxe-breadcrumbs .item:first-of-type,
.brxe-breadcrumbs .separator:first-of-type {
  display: none;
}

/* smaller breadcrumbs for smaller screen widths  */
@media (max-width: 1200px) {
  .brxe-breadcrumbs {
    font-size: 1.1rem !important;
  }
/* separator gap closer on breadcrumbs for smaller screen widths  */
  .brxe-breadcrumbs .separator {
    margin: 0 -.6rem !important; /* reduce horizontal spacing around the slash */
  }
}

/* for when using block editor  */

.block-sp-top {
  padding-top:1.5rem;
}

.block-sp-left {
  padding-left:1.5rem;
}

.block-sp-bottom {
  padding-bottom:1.5rem;
}

.block-sp-right {
  padding-right:1.5rem;
}

/* Start of wpmm-card converting Bricks to gutenburg blocks 9-9-2025  */
/* ===============================
   Equal-height two-column layout
   =============================== */
.wp-block-columns {
  gap: var(--space-l, 24px);
  align-items: stretch;
}
.wp-block-column {
  display: flex;
  flex-direction: column;
}
.wp-block-column > .wpmm-card {
  flex: 1 1 auto; /* card fills its column height */
}
/* ====================
   Card core styling
   ==================== */
.wpmm-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-m, 16px);
  background: var(--base-100, #f9f9f9); /* subtle shaded background */
  border: 1px solid var(--base-300, #e5e7eb);
  border-radius: var(--radius-l, 16px);
  box-shadow: var(--shadow-xs, 0 1px 2px rgba(0,0,0,0.06));
  padding: var(--space-m, 24px);
  transition: transform .2s ease, box-shadow .2s ease;
  cursor: pointer; /* Make it clear the card is clickable */
}
.wpmm-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-s, 0 4px 10px rgba(0,0,0,0.08));
}
/* ====================
   Typography & spacing
   ==================== */
.wpmm-card h3 {
  margin: 0 0 var(--space-m, 16px);
}
.wpmm-card p {
  margin: 0;
}
.wpmm-card p + p,
.wpmm-card p + ul,
.wpmm-card p + ol,
.wpmm-card ul + p,
.wpmm-card ol + p {
  margin-top: var(--space-s, 12px);
}
/* ====================
   Button row spacing
   ==================== */
.wpmm-card .wp-block-buttons {
  margin-bottom: 0;                /* tidy bottom edge */
  padding-top: var(--space-m, 16px); /* breathing room above buttons */
  display: flex;
  justify-content: center; /* Center the buttons */
}
.wpmm-card .wp-block-button {
  margin: 0; /* Remove any default margins */
}
/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .wpmm-card { transition: none; }
}
/* end of wpmm-card   */


/* CTA sections Start */
.wpmm-cta {
  text-align: center; /* centers inline text inside */
}

/* Center headings inside CTA */
.wpmm-cta h1,
.wpmm-cta h2,
.wpmm-cta h3,
.wpmm-cta h4,
.wpmm-cta h5,
.wpmm-cta h6 {
  text-align: center !important;
}

/* Force center alignment of Buttons block inside CTA */
.wpmm-cta .wp-block-buttons {
  display: flex !important;
  justify-content: center !important;
  margin-top: var(--space-xs); /* breathing room above button */
}

/* Nice small-medium heading size */
.wpmm-cta h4 {
  font-size: var(--text-l);
}

/* CTA sections END */


/* START - Living History horizontal cards — scoped */
/* Outer wrapper: grid gap between cards */
.wpmm-hcards {
  display: grid !important;
  grid-auto-rows: auto;
  gap: clamp(30px, 3vw, 48px); /* vertical spacing between cards */
}

/* Card itself */
.wp-block-media-text.wpmm-hcard {
  background: var(--base-50, #f6f9fc);
  border: 1px solid var(--base-300, #e5e7eb);
  border-radius: 24px;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  padding: clamp(14px, 1.6vw, 24px);
  align-items: center;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease;
  grid-template-columns: minmax(480px, 50%) 1fr;
}
.wp-block-media-text.wpmm-hcard:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

/* Image natural size */
.wpmm-hcard .wp-block-media-text__media {
  margin: 0;
}
.wpmm-hcard .wp-block-media-text__media img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

/* Text rhythm */
.wpmm-hcard .wp-block-heading {
  margin: 0 0 .35em 0;
  line-height: 1.2;
}
.wpmm-hcard p {
  margin: 0 0 .85em 0;
}
.wpmm-hcard .wpmm-hcard__link {
  margin: .25rem 0 0 0;
}
.wpmm-hcard .wpmm-hcard__link a {
  font-weight: 600;
  text-decoration: underline;
}

/* Mobile stack */
@media (max-width: 780px) {
  .wp-block-media-text.wpmm-hcard {
    grid-template-columns: 1fr;
  }
  .wpmm-hcard .wp-block-media-text__media img {
    width: 100%;
    height: auto;
  }
}

/* --- Hard gap between Living History cards --- */
.wp-block-group.wpmm-hcards > .wp-block-media-text.wpmm-hcard {
  margin: 0 !important; /* reset any theme margins */
}
.wp-block-group.wpmm-hcards
  > .wp-block-media-text.wpmm-hcard
  + .wp-block-media-text.wpmm-hcard {
  margin-top: clamp(30px, 3vw, 48px) !important; /* reliable space between cards */
}
/* END - Living History horizontal cards — scoped */


/* --- Happy Files Captions bigger --- */
.happyfiles-gallery .figcaption {
  font-size: inherit !important;
  font-weight: 500;
}
/* --END- Happy Files Captions bigger --- */