/** Base font */
@font-face { font-family: "Cormorant Garamond"; font-weight: 500; font-display: swap; src: url("/assets/fonts/cormorantgaramond-medium.ttf"); }

@font-face { font-family: "Cormorant Garamond"; font-weight: 700; font-display: swap; src: url("/assets/fonts/cormorantgaramond-bold.ttf"); }

@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 500; font-display: swap; src: url("/assets/fonts/cormorantgaramond-mediumitalic.ttf"); }

@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 700; font-display: swap; src: url("/assets/fonts/cormorantgaramond-bolditalic.ttf"); }

/** Title font */
@font-face { font-family: "Bree Serif"; font-display: swap; src: url("/assets/fonts/breeserif.ttf"); }

/** Banner font */
@font-face { font-family: "optigibby"; font-display: swap; src: url("/assets/fonts/optigibby.otf"); }

/** Base */
html, body { margin: 0; background-color: #f6ecdb; font: 500 20px/1.4 "Cormorant Garamond", "Garamond", serif; color: #141006; }

h1, h2, h3, h4, h5, h6, p, blockquote, pre, ul, ol, dl, figure { margin: 0 0 15px; }

ul, ol, dd { margin-left: 30px; padding: 0; }

li > ul, li > ol { margin-bottom: 0; }

hr { margin: 0; }

h1, h2, h3, h4, h5, h6 { font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-weight: 400; }

h1 > a, h1 > a:visited, h2 > a, h2 > a:visited, h3 > a, h3 > a:visited, h4 > a, h4 > a:visited, h5 > a, h5 > a:visited, h6 > a, h6 > a:visited { font-weight: 400; color: inherit; }

h1 { font-size: 221%; line-height: normal; letter-spacing: -1px; }

@media screen and (max-width: 800px) { h1 { font-size: 195.5%; } }

h2 { font-size: 170%; }

@media screen and (max-width: 800px) { h2 { font-size: 153%; } }

h3, .modal h1 { font-size: 136%; }

@media screen and (max-width: 800px) { h3, .modal h1 { font-size: 119%; } }

h4, .modal h2 { font-size: 110.5%; }

@media screen and (max-width: 800px) { h4, .modal h2 { font-size: 102%; } }

h5, h6, .modal h3, .modal h4 { font-size: 100%; }

blockquote { padding-left: 15px; border-left: 4px solid #e8e8e8; font-size: 110%; letter-spacing: -1px; font-style: italic; color: #828282; }

blockquote > :last-child { margin-bottom: 0; }

img { max-width: 100%; vertical-align: middle; }

figure { position: relative; }

figure > img { display: block; }

figure figcaption { margin: 0; padding: 0 7.5px; background-color: #141006; background-color: rgba(20, 16, 6, 0.5); text-align: left; font-size: 17.5px; color: #f6ecdb; position: absolute; bottom: 0; left: 0; right: 0; }

a { text-decoration: none; color: #65140f; font-weight: bold; }

a:visited, a:active { color: #4f100c; }

a:hover, a:focus, a:active { outline: none; color: #390b08; }

label { display: inline-block; min-width: 90px; }

input[type=text], input[type=email] { padding: 2px 4px; border: 1px solid #141006; border-radius: 3px; }

button { display: inline-block; margin-top: 0.5em; padding: 0.5em 1em; border: 0 none; border-radius: 5px; background-color: #65140f; text-align: center; text-decoration: none; font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-size: 85%; font-weight: 400; color: #ffffff; cursor: pointer; }

button:hover, button:focus { background-color: #390b08; }

button:active { background-color: #220705; }

div { margin-bottom: 0.2em; }

pre, code { border: 1px solid #e8e8e8; border-radius: 3px; background-color: #eeeeff; font-size: 15px; }

pre { padding: 8px 12px; overflow-x: auto; }

pre > code { border: 0; padding-right: 0; padding-left: 0; }

code { padding: 1px 5px; }

.wrapper { max-width: 740px; margin-right: auto; margin-left: auto; padding-right: 30px; padding-left: 30px; position: relative; }

@media screen and (max-width: 800px) { .wrapper { max-width: 770px; padding-right: 15px; padding-left: 15px; } }

.modal { display: none; height: 100%; width: 100%; background-color: rgba(20, 16, 6, 0.75); z-index: 9; position: fixed; top: 0; left: 0; }

.modal.active { display: block; }

.modal .modal-close { text-decoration: none; position: absolute; top: 10px; right: 10px; }

.modal .modal-content { display: block; max-width: 738px; margin: 60px auto; padding: 30px; background-color: #ffffff; border: 2px solid #e8e8e8; border-radius: 10px; box-shadow: 0 0 10px #141006; position: relative; }

@media screen and (max-width: 800px) { .modal .modal-content { margin-left: 30px; margin-right: 30px; } }

@media screen and (max-width: 600px) { .modal { height: 100%; width: 100%; background-color: #f6ecdb; overflow: auto; } .modal .modal-content { margin: 0; border: 0 none; border-radius: 0; box-shadow: none; } }

.wrapper:after { content: ""; display: table; clear: both; }

/** Site header */
#top { min-height: 3.2em; border-top: 5px solid #f6ecdb; background-color: #f6ecdb; border-bottom: 2.35em solid #cc1518; position: relative; z-index: 2; }

#top a, #top a:visited, #top nav, #top i:before { font-weight: 400; color: #141006; }

#top a:hover, #top a:focus, #top a:hover i:before, #top a:focus i:before { text-decoration: underline; color: black; }

#top a:active, #top a:active i:before { text-decoration: underline; color: black; }

#top nav { font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-size: 85%; margin: 0 30px; padding: 1em 0; text-shadow: 1px 1px 0 #f6ecdb, -1px -1px 0 #f6ecdb, -1px 1px 0 #f6ecdb, 1px -1px 0 #f6ecdb; text-align: center; position: absolute; top: 0; right: 0; }

#top nav ul { margin: 0; list-style: none; }

#top nav li { display: inline; white-space: nowrap; }

#top nav li:not(:last-child):after { content: "|"; }

#top nav a.active { font-weight: bold; }

#top nav i { display: inline-block; min-width: 1.25em; text-align: center; }

@media screen and (max-width: 600px) { #top nav { margin: 0 15px; } }

#accessibility { width: 100%; white-space: normal; position: absolute; top: 0; left: 0; z-index: 9; }

#accessibility a { padding: 7.5px 10px; border: 1px solid #141006; font-weight: bold; text-align: center; text-decoration: none; line-height: normal; background-color: #f6ecdb; color: #141006; position: absolute; top: 15px; right: 100%; }

#accessibility a:hover, #accessibility a:focus { left: 1em; right: auto; color: #65140f; }

#accessibility a:active { left: 1em; right: auto; color: #220705; }

#site-title { text-transform: uppercase; font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-weight: 400; position: relative; }

#site-title img { height: 10.25em; max-width: none; margin-bottom: -3.25em; }

/** Site footer */
#bottom { padding: 45px 0; border-top: 1px solid #65140f; background-color: #65140f; font-size: 94%; line-height: normal; color: #ffffff; }

#bottom h2 { font-size: 130%; }

#bottom a { font-weight: 500; color: #ffffff; }

#bottom a, #bottom a:visited { color: #ffffff; }

#bottom a:hover, #bottom a:focus { text-decoration: underline; color: #bfbfbf; }

#bottom a:active { text-decoration: underline; color: #a6a6a6; }

#bottom p { float: left; width: 40%; }

#bottom ul { margin-left: 0; list-style: none; }

#share-buttons { font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-size: 85%; font-weight: 400; float: left; width: 33%; padding: 0 1%; }

#share-buttons li { display: block; float: left; min-width: 60px; padding-left: 15px; padding-bottom: 15px; text-align: center; }

#share-buttons li:nth-child(odd) { clear: left; }

#share-buttons a { color: #ffffff; }

#languages { font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-size: 85%; font-weight: 400; float: left; width: 25%; }

#languages li { display: inline; }

#languages li:not(:last-child):after { content: "|"; }

#languages a.active { font-weight: bold; }

@media screen and (max-width: 800px) { #bottom p, #share-buttons { width: 70%; padding: 0; } #bottom p li:nth-child(odd), #share-buttons li:nth-child(odd) { clear: none; } #languages { float: none; clear: left; width: 100%; } }

@media screen and (max-width: 600px) { #bottom p, #share-buttons, #languages { float: none; clear: left; width: 100%; } }

/** Page content */
#main { padding: 30px 0; }

#main header { margin-bottom: 30px; }

#main header p { font-size: 17.5px; color: #303036; }

#main .wrapper { background-color: #ffffff; padding-top: 15px; padding-bottom: 15px; border-radius: 10px; }

#main .next-wrapper { margin-top: 15px; }

@media screen and (max-width: 800px) { #main { padding-top: 0; padding-bottom: 0; } #main .wrapper { margin-bottom: 0; border-radius: 0; } }

#banner { background-color: #e0c6a3; text-align: center; position: relative; z-index: 1; }

#banner img { max-height: 310px; }

#banner p { width: 100%; margin: 0; padding-top: 5%; line-height: 125%; letter-spacing: 0.25em; text-align: left; text-transform: uppercase; text-shadow: 3px 3px 6px #141006; font-family: "optigibby", "Cormorant Garamond", "Garamond", serif; font-size: 300%; font-size: min(470%, 7.5vw); font-weight: bold; color: #ffffff; position: absolute; top: 0; left: 0; }

@media screen and (max-width: 800px) { #banner p { padding-left: 2%; } }

#banner .sign-up { width: 100%; margin-bottom: -30px; text-align: center; background-color: #f6ecdb; }

#banner .sign-up div { display: inline-block; margin-bottom: -0.5em; border-radius: 10px; background-color: #f6ecdb; position: relative; top: -30px; }

#banner .sign-up a { display: inline-block; }

#banner .sign-up button { padding: 0.75em 1em; margin-top: 0; border: 0 none; border-radius: 0; font-size: 102%; }

@media screen and (max-width: 800px) { #banner .sign-up { background-color: #ffffff; } #banner .sign-up div { margin-bottom: -30px; background-color: transparent; } #banner .sign-up a { display: block; margin-top: 0.2em; } #banner .sign-up button { border-radius: 10px; } }

#banner .sign-up a:first-child button { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }

#banner .sign-up a:last-child button { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }

.events { list-style: none; margin-left: 0; }

.events li { display: block; float: left; width: 50%; height: 90px; margin-bottom: 15px; overflow: hidden; }

.events li a { display: block; height: 100%; margin-left: 7.5px; margin-right: 7.5px; background-color: #e0c6a3; text-align: center; position: relative; }

.events li p { margin: 0; padding: 0 7.5px; background-color: #141006; background-color: rgba(20, 16, 6, 0.5); text-align: left; font-family: "Bree Serif", "Cormorant Garamond", "Garamond", serif; font-size: 76.5%; font-weight: 400; color: #f6ecdb; position: absolute; bottom: 0; left: 0; right: 0; }

.events li p span { white-space: nowrap; }

.events li time { float: right; }

@media screen and (max-width: 600px) { .events li { float: none; width: 100%; } .events li a { margin-left: 0; margin-right: 0; } }

.posts { list-style: none; margin-left: 0; }

.posts time { padding: 1px 5px; border: 1px solid #e8e8e8; border-radius: 3px; font-size: 15px; }
