@font-face
{
 font-family:souvenir;
 font-style:normal;
 font-weight:400;
 src:local('Souvenir'),url(/fonts/Souvenir.woff) format('woff')
 font-display: swap;
}
@font-face
{
 font-family:souvenir;
 font-style:italic;
 font-weight:400;
 src:local('Souvenir'),url(/fonts/SouvenirI.woff) format('woff')
 font-display: swap;
}
@font-face
{
 font-family:souvenir;
 font-style:normal;
 font-weight:700;src:local('Souvenir'),url(/fonts/SouvenirB.woff) format('woff')
 font-display: swap;
}
@font-face
{
 font-family:souvenir;
 font-style:italic;
 font-weight:700;
 src:local('Souvenir'),url(/fonts/SouvenirBI.woff) format('woff')
 font-display: swap;
}

:root
{
  --font-headers: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --font-body: souvenir, Georgia, Times, "Times New Roman", serif;
}
html
{
 background: url(/5bg.webp) no-repeat center center fixed;
 background-size: cover;
 background-color: #033;
}
body
{
 font-family: var(--font-body);
 line-height:1.5;
 letter-spacing: 0.03125em;
 word-spacing: .0625em;
 zmin-height: 100vh;
 margin:0;
 padding: 1vmin;
}
nw
{
 display:inline-block;
}
a
{
 color:#fff;
}
b
{
  color:#ac9;
}
.nav-text
{
 padding-top:.25em;
}
#nav
{
 float: right;
 color:#fff;
 font-size:max(3vmin, 24px);
 background:rgba(32,64,64,.5);
 padding-left:1.5em;
 border-radius:.75em;
}
#nav ul
{
 margin:0;
 padding:0;
 display:flex;
 flex-wrap:wrap;
}
#nav li
{
 flex-shrink:0;
 flex-grow:1;
 list-style:none;
 justify-content:center;
 margin-top:auto;
 margin-right:1.5em;
 color:#fff;
 display:inline-block;
}
#nav a
{
 color:#fff;
 text-decoration:none;
}
#nav a:hover
{
 color:#ac9;
 text-decoration:underline;
}

#subnav ul
{
 margin:0;
 padding:0;
 display:flex;
 flex-wrap:wrap;
}
#subnav li
{
 flex-shrink:0;
 list-style:none;
 justify-content:center;
 margin-top:auto;
 margin-right:1.5em;
 white-space:nowrap;
}

#content
{
 width:100%;
 color:#ccc;
 padding-top:3vmin;
 font-size: max(2.3vh, 14px);
}
h1, h2, h3, h4
{
 font-family: var(--font-headers);
 text-wrap: balance;
}
#content h1
{
 color:#9bc;
 color:#688;
}
#content h2, #content h3
{
 color:#8a8;
}
#content a
{
 color:#8a8;
 ztext-decoration:none;
 text-decoration-color:#aca;
}
#content a:hover
{
 color:#aca;
 ztext-decoration:underline;
}
#meet
{
 position:absolute;
 bottom:0;
 right:0;
 padding:.5em;
 background-color:rgba(255,255,255,.7);
 font-size:max(3vmin, 16px);
 color:#033;
 text-align:center;
 border-top-left-radius:1em;
}
#meet b
{
  color: inherit;
}
#meet a, #meet a:hover
{
 color:#033;
}
img, picture
{
 color:#fff;
 max-width: 100%;
}
#building, #church, #welcome
{
 display:none;
}
input, button, select
{
 background-color:#eee;
 color:#033;
 font-family: inherit;
 font-size: inherit;
 display: inline-block;
 border-radius: .25em;
 border: 1px solid transparent;
 max-width: 90%;
}
input::file-selector-button
{
 background-color:#eee;
 color:#033;
 border-radius: .25em;
}
input::placeholder
{
 color:#033;
}
input[type="image"]
{
  background:none;
}
input:invalid
{
  border: 1px dashed #f00;
}
textarea
{
 background-color:#eee;
 color:#033;
 font-family: inherit;
 font-size: inherit;
 border-radius: .25em;
 max-width: 90%;
}
#about_img
{
 border-radius:1em;
 margin:.5em;
 aspect-ratio: 4 / 3;

 float:right;
 max-width:50%;
 max-height:80vh;
}

.flexwrap
{
 display:flex;
 flex-wrap: nowrap;
}

@media only screen and (max-width: 1000px)
{
 .flexwrap
 {
  width:100%;
  display:flex;
  flex-wrap: wrap;
 }
 #about_img
 {
  float:none;
  max-width:90vw;
  max-height:90vh;
 }
}

#slide_container
{
 background-color:#fff;
 color:#000;
 overflow:hidden;
 float:right;
 min-width:260px;
 max-width:min(800px, 50%);

 margin-left:1em;
 margin-right:1em;
 margin-bottom:1em;
 border-radius:1em;


 zborder:2px solid #000;
 zborder-radius:.75em;
 zmargin-left:1em;
 zmargin-right:2em;
 zmargin-bottom:2em;
 ztransform:rotate(-4deg);
}
#slide_container a
{
  color:#000;
}
#slide_container a:hover
{
 color:#06f;
 text-decoration:underline;
}

#sidebar
{
 background:rgba(255,255,255,.5);
 margin:1em;
 border-radius:1em;padding:1em;
 color:#033;
}
#sidebar h1, #sidebar h2, #sidebar h3
{
 color:#033;
}
#sidebar a, #sidebar a:hover
{
 color:#033;
}

#switcher-flag::before
{
  font-size: 1.5rem;
}

#flag-display::before { content: "🇪🇸"; }
#flag-English::before { content: "🇺🇸"; }
/* --- North and Central America --- */
:root:lang(es-MX) #flag-display::before { content: "🇲🇽"; } /* Mexico */
:root:lang(es-GT) #flag-display::before { content: "🇬🇹"; } /* Guatemala */
:root:lang(es-HN) #flag-display::before { content: "🇭🇳"; } /* Honduras */
:root:lang(es-SV) #flag-display::before { content: "🇸🇻"; } /* El Salvador */
:root:lang(es-NI) #flag-display::before { content: "🇳🇮"; } /* Nicaragua */
:root:lang(es-CR) #flag-display::before { content: "🇨🇷"; } /* Costa Rica */
:root:lang(es-PA) #flag-display::before { content: "🇵🇦"; } /* Panama */
/* --- South America --- */
:root:lang(es-AR) #flag-display::before { content: "🇦🇷"; } /* Argentina */
:root:lang(es-BO) #flag-display::before { content: "🇧🇴"; } /* Bolivia */
:root:lang(es-CL) #flag-display::before { content: "🇨🇱"; } /* Chile */
:root:lang(es-CO) #flag-display::before { content: "🇨🇴"; } /* Colombia */
:root:lang(es-EC) #flag-display::before { content: "🇪🇨"; } /* Ecuador */
:root:lang(es-PY) #flag-display::before { content: "🇵🇾"; } /* Paraguay */
:root:lang(es-PE) #flag-display::before { content: "🇵🇪"; } /* Peru */
:root:lang(es-UY) #flag-display::before { content: "🇺🇾"; } /* Uruguay */
:root:lang(es-VE) #flag-display::before { content: "🇻🇪"; } /* Venezuela */
/* --- Caribbean (Islands) --- */
:root:lang(es-CU) #flag-display::before { content: "🇨🇺"; } /* Cuba */
:root:lang(es-DO) #flag-display::before { content: "🇩🇴"; } /* Dominican Republic */
:root:lang(es-PR) #flag-display::before { content: "🇵🇷"; } /* Puerto Rico */
/* Spanish (general) fallback for lang="es" without region */
:root:lang(es) #flag-display::before { content: "🇲🇽"; } 
#lang-switcher-bar
{
  display: inline;
}
:root:lang(en) #lang-switcher-bar
{
  display: none;
}

@media print
{
 .no-print, .no-print *
 {
  display: none !important;
 }
 body
 {
  background-color:#fff !important;
  color:#000 !important;
 }
 h1,h2,h3,h4,h5,h6
 {
  page-break-after:avoid;
 }
 a img
 {
  border: none;
 }
 a[href]::after
 {
  content: " (" attr(href) ") ";
  font-size: 90%;
 }
 a[href^="#"]:after, a[href^="javascript:"]:after
 {
  content: "";
 }
 abbr[title]:after
 {
  content: " (" attr(title) ")";
 }
 svg, img, tr, table, canvas
 {
  max-width: 100% !important;
  page-break-inside: avoid;
 }
}