:root{
  --cover-text-color:#0A4853;--highlight:#6CE9FF;--highlight-contrast:var(--cover-text-color);
  --highlight-inverse:var(--cover-text-color);--highlight-inverse-contrast:#fff;
  --sticky-menu-text-color:#18C7E6;
  --section-light-text-color:#3a4145;--section-light-bg-color:#f2efe8;
  --section-dark-text-color:var(--section-light-bg-color);--section-dark-bg-color:#16a3bc;
  --single-page-text-color:var(--section-light-text-color);--single-page-bg-color:var(--section-light-bg-color);
  --footer-color-background:#22343a;--footer-color:#bbc7cc;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;font-size:112.5%}
body{margin:0;font-family:'Roboto Slab',Georgia,serif;font-weight:400;line-height:1.7;hyphens:auto;-webkit-hyphens:auto;color:var(--section-light-text-color);background:var(--section-light-bg-color)}
h1,h2,h3{font-family:'Open Sans',sans-serif;font-weight:700}
.screen-reader-text{position:absolute;left:-9999px}

/* Cover */
.cover{height:57vw;min-height:440px;max-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;background-size:cover;background-position:center;color:var(--cover-text-color);padding:1rem}
.cover-inner{max-width:900px}
#blog-logo{max-height:90px;width:auto;margin-bottom:.4rem}
.blog-title{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:700;margin:.2em 0;text-shadow:white 0 0 7px}
.blog-description{font-size:1.2rem;text-shadow:white 0 0 7px}
.cover-buttons{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:1.2rem}
.cover-arrow{display:inline-block;margin-top:.8rem;font-size:2.8rem;color:var(--cover-text-color);text-decoration:none;opacity:.85}
.button{display:inline-block;padding:.35rem .9rem;border:2px solid var(--highlight);background:var(--highlight);color:var(--highlight-contrast);font-family:'Oswald',sans-serif;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px;text-decoration:none;border-radius:4px;transition:.2s}
.button:hover{background:var(--highlight-inverse);color:var(--highlight-inverse-contrast);border-color:var(--highlight-inverse)}

/* Sticky nav */
.sticky-nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;background:rgba(34,52,58,.95);transform:translateY(-100%);transition:transform .25s}
.sticky-nav.visible{transform:none}
body.admin-bar .sticky-nav{top:32px}
.sticky-nav a{color:var(--sticky-menu-text-color);text-decoration:none;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px}
.sticky-nav ul{list-style:none;margin:0 0 0 auto;padding:0;display:flex;gap:1.2rem}
.nav-toggle{display:none;margin-left:auto;background:none;border:0;color:var(--sticky-menu-text-color);font-size:1.4rem;cursor:pointer}
@media(max-width:700px){
  .nav-toggle{display:block}
  .sticky-nav{flex-wrap:wrap}
  .sticky-nav ul{display:none;flex-direction:column;width:100%;margin:0;padding:.5rem 0}
  .sticky-nav.open ul{display:flex}
}

/* Sections */
.section{position:relative;padding:3rem 1rem 3.2rem}
.section-light{background:var(--section-light-bg-color);color:var(--section-light-text-color)}
.section-dark{background:var(--section-dark-bg-color);color:var(--section-dark-text-color)}
.section-inner,.single-inner{max-width:700px;margin:0 auto}
.section h2{font-size:2rem;text-align:left;margin:0 0 1rem;line-height:1.2}
.section-content p{margin:0 0 1rem}
.section-dark::before,.section-dark::after{content:'';position:absolute;width:48px;height:22px;clip-path:polygon(0 0,100% 0,50% 100%)}
.section-dark::before{top:0;left:6.5%;background:var(--section-light-bg-color)}
.section-dark::after{bottom:-22px;right:6.5%;background:var(--section-dark-bg-color);z-index:2}
.section-light a{color:inherit}
.section-dark a{color:inherit}
.contact-list{list-style:none;padding:0;text-align:left}
.contact-list li{margin:0 0 1.1rem}
.contact-list .fa-brands,.contact-list .fa-solid{display:inline-block;width:1.3em;margin-right:.2em}
.single-page{background:var(--single-page-bg-color);color:var(--single-page-text-color);padding:6rem 1rem 4rem;min-height:70vh}

/* Footer */
.site-footer{background:var(--footer-color-background);color:var(--footer-color);text-align:center;padding:1.5rem 1rem;font-size:.8rem;line-height:1.5;font-family:'Open Sans',sans-serif}
.site-footer a{color:var(--footer-color)}
.footer-contacts{display:flex;gap:1.2rem;justify-content:center;font-size:.9rem;margin-bottom:.6rem}

/* Calendar (from the Hugo shortcode) */

.calendar {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}
.calendarEntry {
    padding: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    white-space: normal;
}
.calendarEntry>div {
    display: inline-block;
    vertical-align: middle;
}
.calendarDate {
    background-color: var(--highlight);
    color: var(--highlight-contrast);
    min-width: 80px;
    max-width: 80px;
    height: 100px;
    flex-grow: 100;
    text-align: center;
    border-radius: 10px;
    font-family: oswald, sans-serif;
}
.calendarDate div {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: lighter;
}
.calendarWeekday {
    font-size: 12px;
    line-height: 30px;
}
.calendarDay{
    font-size: 40px;
    line-height: 40px;
}
.calendarMonth {
    font-size: 12px;
    line-height: 30px;
}
.calendarDetails {
    height: 90px;
    margin-left: 10px;
    height: auto;
    margin-left: 10px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}
.calendarTitle {
    font-weight: bold;
}
.calendarTime, .calendarLocation {
    font-size: 80%;
}

/* Floating section index (wide screens): appears once past the first section */
.side-index{display:none}
@media(min-width:1200px){
  .side-index{display:block;position:fixed;left:0;top:38%;z-index:40;background:var(--section-light-bg-color);border-radius:0 1.2rem 1.2rem 0;padding:.8rem 1.4rem .8rem 1.1rem;box-shadow:0 2px 12px rgba(0,0,0,.15);opacity:0;pointer-events:none;transform:translate(-100%,-50%);transition:opacity .3s,transform .3s}
  .side-index.visible{opacity:1;pointer-events:auto;transform:translate(0,-50%)}
  .side-index ul{list-style:none;margin:0;padding:0}
  .side-index a{display:block;padding:.1rem 0;font-family:'Open Sans',sans-serif;font-stretch:75%;font-weight:700;font-size:.72rem;letter-spacing:.2px;text-transform:uppercase;text-decoration:none;color:#707070;transition:color .2s}
  .side-index a:hover{color:var(--sticky-menu-text-color)}
  .side-index a.active{color:#5bc8e8}
  /* the index replaces the top bar */
  .sticky-nav{display:none}
}