@import url(googlefonts.css);

a,
b,
body,
center,
code,
dd,
div,
dt,
footer,
h1,
h2,
h3,
h4,
h5,
h6,
header,
html,
i,
img,
li,
nav,
ol,
p,
q,
s,
section,
span,
summary,
u,
ul,
var {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  color: #000
}

footer,
header,
nav,
section {
  display: block
}

body {
  line-height: 1
}

ol,
ul {
  list-style: none
}

q {
  quotes: none
}

q:after,
q:before {
  content: "";
  content: none
}

body {
  -webkit-text-size-adjust: none
}

body {
  -ms-overflow-style: scrollbar
}

@media screen and (max-width: 480px) {

  body,
  html {
    min-width: 320px
  }
}

html {
  box-sizing: border-box
}

*,
:after,
:before {
  box-sizing: inherit
}

body.is-preload *,
body.is-preload :after,
body.is-preload :before {
  -moz-animation: none !important;
  -webkit-animation: none !important;
  -ms-animation: none !important;
  animation: none !important;
  -moz-transition: none !important;
  -webkit-transition: none !important;
  -ms-transition: none !important;
  transition: none !important
}

body {
  background-color: #fff;
  color: #000
}

header {
  font-family: "Press Start 2P";
  font-size: 10pt;
  color: #000;
  line-height: 1.65
}

body {
  font-family: Carlito, sans-serif !important;
  font-size: 17pt;
  font-weight: 300;
  line-height: 1.65;
  color: #000
}

@media screen and (max-width: 1680px) {
  body {
    font-size: 14pt
  }
}

@media screen and (max-width: 1280px) {
  body {
    font-size: 12pt
  }
}

@media screen and (max-width: 360px) {
  body {
    font-size: 11pt
  }
}

a {
  -moz-transition: color .2s ease, border-bottom .2s ease;
  -webkit-transition: color .2s ease, border-bottom .2s ease;
  -ms-transition: color .2s ease, border-bottom .2s ease;
  transition: color .2s ease, border-bottom .2s ease;
  text-decoration: none;
  border-bottom: dotted 1px;
  color: inherit
}

a:hover {
  border-bottom-color: transparent
}

b {
  font-weight: 400
}

i {
  font-style: italic
}

/*p {*/
/*  margin: 0 0 2em 0*/
/*}*/

p.content {
  -moz-columns: 20em 2;
  -webkit-columns: 20em 2;
  -ms-columns: 20em 2;
  columns: 20em 2;
  -moz-column-gap: 2em;
  -webkit-column-gap: 2em;
  -ms-column-gap: 2em;
  column-gap: 2em;
  text-align: justify
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 300;
  line-height: 1.5;
  margin: 0 0 .7em 0;
  letter-spacing: -.025em
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  text-decoration: none
}

h1 {
  font-size: 2.5em;
  line-height: 1.2
}

h2 {
  font-size: 1.5em
}

h3 {
  font-size: 1.25em
}

h4 {
  font-size: 1.1em
}

h5 {
  font-size: .9em
}

h6 {
  font-size: .7em
}

@media screen and (max-width: 736px) {
  h1 {
    font-size: 2em
  }
}

code {
  border-radius: 8px;
  border: solid 1px;
  font-family: "Courier New", monospace;
  font-size: .9em;
  margin: 0 .25em;
  padding: .25em .65em
}

a:hover {
  color: #595959
}

b {
  color: #fff
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000
}

code {
  background: rgba(255, 255, 255, .075);
  border-color: rgba(255, 255, 255, .35)
}

.icon {
  text-decoration: none;
  -moz-transition: background-color .2s ease-in-out, color .2s ease-in-out;
  -webkit-transition: background-color .2s ease-in-out, color .2s ease-in-out;
  -ms-transition: background-color .2s ease-in-out, color .2s ease-in-out;
  transition: background-color .2s ease-in-out, color .2s ease-in-out;
  border-bottom: none;
  position: relative
}

.icon:before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  text-transform: none !important;
  font-family: "Font Awesome 5 Free";
  font-weight: 400
}

.icon:before {
  line-height: 0;
}

.icon.major {
  border: solid 1px;
  display: inline-block;
  border-radius: 100%;
  padding: .65em;
  margin: 0 0 2em 0;
  cursor: default
}

.icon.major:before {
  display: inline-block;
  font-size: 6.25rem;
  width: 2.25em;
  height: 2.25em;
  line-height: 2.2em;
  border-radius: 100%;
  border: solid 1px;
  text-align: center
}

.icon.alt {
  display: inline-block;
  border: solid 1px;
  border-radius: 100%
}

.icon.alt:before {
  display: block;
  font-size: 1.25em;
  width: 2em;
  height: 2em;
  text-align: center;
  line-height: 2em
}

.icon.style1 {
  color: #efa8b0
}

.icon.style2 {
  color: #c79cc8
}

.icon.style3 {
  color: #a89cc8
}

.icon.style4 {
  color: #9bb2e1
}

.icon.style5 {
  color: #8cc9f0
}

@media screen and (max-width: 1680px) {
  .icon.major:before {
    font-size: 5.5rem
  }
}

@media screen and (max-width: 1280px) {
  .icon.major:before {
    font-size: 4.75rem
  }
}

@media screen and (max-width: 736px) {
  .icon.major {
    margin: 0 0 1.5em 0;
    padding: .35em
  }

  .icon.major:before {
    font-size: 3.5rem
  }
}

.icon.major {
  border-color: rgba(255, 255, 255, .35)
}

.icon.major:before {
  border-color: rgba(255, 255, 255, .35)
}

.icon.alt {
  border-color: rgba(255, 255, 255, .35);
  color: #595959
}

.icon.alt:hover {
  background-color: rgba(255, 255, 255, .075)
}

.icon.alt:active {
  background-color: rgba(255, 255, 255, .2)
}

section.special {
  text-align: center
}

header.major {
  margin-bottom: 3em
}

header.major h2 {
  font-size: 2em
}

header.major h2:after {
  display: block;
  content: "";
  width: 3.25em;
  height: 2px;
  margin: .7em 0 1em 0;
  border-radius: 2px
}

section.special header.major h2:after {
  margin-left: auto;
  margin-right: auto
}

header.major p {
  font-size: 1.25em;
  letter-spacing: -.025em
}

header.major.special {
  text-align: center
}

header.major.special h2:after {
  margin-left: auto;
  margin-right: auto
}

footer.major {
  margin-top: 3em
}

@media screen and (max-width: 736px) {
  header.major {
    margin-bottom: 0
  }

  header.major h2 {
    font-size: 1.5em
  }

  header.major p {
    font-size: 1em;
    letter-spacing: 0
  }

  header.major p br {
    display: none
  }

  footer.major {
    margin-top: 0
  }
}

header.major h2:after {
  background-color: rgba(255, 255, 255, .35)
}

#header {
  padding: 5em 5em 1em 5em;
  text-align: center
}

#header h1 {
  margin: 0 0 .25em 0
}

#header p {
  font-size: 1.25em;
  letter-spacing: -.025em
}

#header.alt {
  padding: 7em 5em 4em 5em
}

#header.alt h1 {
  font-size: 3.25em
}

.animatedheader > * {
  -moz-transition: opacity 3s ease;
  -webkit-transition: opacity 3s ease;
  -ms-transition: opacity 3s ease;
  transition: opacity 3s ease;
  -moz-transition-delay: .5s;
  -webkit-transition-delay: .5s;
  -ms-transition-delay: .5s;
  transition-delay: .5s;
  opacity: 1
}

.animatedheader .logo {
  -moz-transition: opacity 1.25s ease, -moz-transform .5s ease;
  -webkit-transition: opacity 1.25s ease, -webkit-transform .5s ease;
  -ms-transition: opacity 1.25s ease, -ms-transform .5s ease;
  transition: opacity 1.25s ease, transform .5s ease;
  -moz-transition-delay: 0s;
  -webkit-transition-delay: 0s;
  -ms-transition-delay: 0s;
  transition-delay: 0s
}

#header.alt .logo {
  display: block;
  margin: 0 0 1.5em 0
}

#header.alt > * {
  opacity: 1
}

#header.alt .logo img {
  display: block;
  margin: 0 auto;
  border-radius: 100%;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  max-width: 15%;
  box-shadow: 1px 1px 10px #595959
}

@media screen and (max-width: 1280px) {
  #header {
    padding: 4em 4em .1em 4em
  }

  #header.alt {
    padding: 6em 4em 3em 4em
  }
}

@media screen and (max-width: 980px) {
  #header {
    padding: 4em 3em .1em 3em
  }

  #header.alt {
    padding: 5em 3em 2em 3em
  }
}

@media screen and (max-width: 736px) {
  #header {
    padding: 3em 2em .1em 2em
  }

  #header p {
    font-size: 1em;
    letter-spacing: 0
  }

  #header p br {
    display: none
  }

  #header.alt {
    padding: 4em 2em 1em 2em
  }

  #header.alt h1 {
    font-size: 2.5em
  }
}

@media screen and (max-width: 480px) {
  #header {
    padding: 3em 1.5em .1em 1.5em
  }

  #header.alt {
    padding: 4em 1.5em 1em 1.5em
  }
}

@media screen and (max-width: 360px) {
  #header {
    padding: 2.5em 1em .1em 1em
  }

  #header.alt {
    padding: 3.5em 1em .5em 1em
  }
}

body.is-preload #header.alt > * {
  opacity: 0
}

body.is-preload #header.alt .logo {
  -moz-transform: scale(.8) rotate(-30deg);
  -webkit-transform: scale(.8) rotate(-30deg);
  -ms-transform: scale(.8) rotate(-30deg);
  transform: scale(.8) rotate(-30deg)
}

#nav {
  -moz-transition: background-color .2s ease, border-top-left-radius .2s ease, border-top-right-radius .2s ease, padding .2s ease;
  -webkit-transition: background-color .2s ease, border-top-left-radius .2s ease, border-top-right-radius .2s ease, padding .2s ease;
  -ms-transition: background-color .2s ease, border-top-left-radius .2s ease, border-top-right-radius .2s ease, padding .2s ease;
  transition: background-color .2s ease, border-top-left-radius .2s ease, border-top-right-radius .2s ease, padding .2s ease;
  background-color: #fff;
  color: #636363;
  border-top-left-radius: .25em;
  border-top-right-radius: .25em
}

#nav a,
.uk-offcanvas a {
  border-bottom: none;
  font-family: Carlito, sans-serif
}

#nav a {
  padding-left: 1em;
  padding-right: 1em;
  margin-right: -1em;
  margin-left: -1em
}

#nav a:hover {
  color: #636363
}

#nav b {
  color: #636363
}

#nav ul li a:hover {
  background-color: rgba(222, 222, 222, .25)
}

#offcanvas-toggle {
  display: none
}

@media screen and (max-width: 870px) {
  #nav {
    display: none
  }

  #offcanvas-toggle {
    display: block;
    position: fixed;
    top: 1.5rem;
    right: 1.5rem
  }

  #nav + #main {
    padding-top: 0
  }
}

#main {
  background-color: #fff;
  color: #636363;
  border-radius: .25em
}

#main a:hover {
  color: #636363
}

#main b {
  color: #636363
}

#main h1,
#main h2,
#main h3,
#main h4,
#main h5,
#main h6 {
  margin-top: 1em;
  color: #636363
}

#main code {
  background: rgba(222, 222, 222, .25);
  border-color: #ddd
}

#main ::-webkit-input-placeholder {
  color: rgba(99, 99, 99, .25) !important
}

#main :-moz-placeholder {
  color: rgba(99, 99, 99, .25) !important
}

#main ::-moz-placeholder {
  color: rgba(99, 99, 99, .25) !important
}

#main :-ms-input-placeholder {
  color: rgba(99, 99, 99, .25) !important
}

#main .icon.major {
  border-color: #ddd
}

#main .icon.major:before {
  border-color: #ddd
}

#main .icon.alt {
  border-color: #ddd;
  color: #636363
}

#main .icon.alt:hover {
  background-color: rgba(222, 222, 222, .25)
}

#main .icon.alt:active {
  background-color: rgba(222, 222, 222, .5)
}

#main ul.alt li {
  border-top-color: #ddd
}

#main header.major h2:after {
  background-color: #ddd;
  background-image: -moz-linear-gradient(90deg, #2dffab, #81ff2d, #ffab2d, #ff2d81, #ab2dff, #2d81ff);
  background-image: -webkit-linear-gradient(90deg, #2dffab, #81ff2d, #ffab2d, #ff2d81, #ab2dff, #2d81ff);
  background-image: -ms-linear-gradient(90deg, #2dffab, #81ff2d, #ffab2d, #ff2d81, #ab2dff, #2d81ff);
  background-image: linear-gradient(90deg, #2dffab, #81ff2d, #ffab2d, #ff2d81, #ab2dff, #2d81ff)
}

#main > .main {
  padding: 5em 5em 3em 5em;
}

#main > .main:first-child {
  border-top: 0
}

#main > .main > .image.main:first-child {
  margin: -5em 0 5em -5em;
  width: calc(100% + 10em);
  border-radius: .25em .25em 0 0;
}

#main > .main > .image.main:first-child img {
  border-radius: .25em .25em 0 0;
}

@media screen and (max-width: 1280px) {
  #main > .main {
    padding: 4em 4em 2em 4em
  }

  #main > .main > .image.main:first-child {
    margin: -4em 0 4em -4em;
    width: calc(100% + 8em)
  }
}

@media screen and (max-width: 980px) {
  #main > .main {
    padding: 4em 3em 2em 3em
  }

  #main > .main > .image.main:first-child {
    margin: -4em 0 4em -3em;
    width: calc(100% + 6em)
  }
}

@media screen and (max-width: 736px) {
  #main > .main {
    padding: 3em 2em 1em 2em
  }

  #main > .main > .image.main:first-child {
    margin: -3em 0 2em -2em;
    width: calc(100% + 4em)
  }
}

@media screen and (max-width: 480px) {
  #main > .main {
    padding: 3em 1.5em 1em 1.5em
  }

  #main > .main > .image.main:first-child {
    margin: -3em 0 1.5em -1.5em;
    width: calc(100% + 3em)
  }
}

@media screen and (max-width: 360px) {
  #main {
    border-radius: 0
  }

  #main > .main {
    padding: 2.5em 1em .5em 1em
  }

  #main > .main > .image.main:first-child {
    margin: -2.5em 0 1.5em -1em;
    width: calc(100% + 2em);
    border-radius: 0
  }

  #main > .main > .image.main:first-child img {
    border-radius: 0
  }
}

#footer {
  display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -moz-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 5em 5em 3em 5em;
  width: calc(100% + 2em);
  margin: 0 0 3em -2em
}

#footer > * {
  width: calc(50% - 2em);
  margin-left: 2em
}

#footer .copyright {
  width: 100%;
  margin: 2.5em 0 2em 2em;
  font-size: .8em;
  text-align: center
}

@media screen and (max-width: 1280px) {
  #footer {
    padding: 4em 4em 2em 4em
  }
}

@media screen and (max-width: 980px) {
  #footer {
    padding: 4em 3em 2em 3em;
    display: block;
    margin: 0 0 3em 0;
    width: 100%
  }

  #footer > * {
    width: 100%;
    margin-left: 0;
    margin-bottom: 3em
  }

  #footer .copyright {
    text-align: left
  }
}

@media screen and (max-width: 736px) {
  #footer {
    padding: 3em 2em 1em 2em
  }
}

@media screen and (max-width: 480px) {
  #footer {
    padding: 3em 1.5em 1em 1.5em
  }
}

@media screen and (max-width: 480px) {
  #footer {
    padding: 2.5em 1em .5em 1em
  }
}

.calendar {
  max-width: 1100px;
  min-width: 600px;
  min-height: 800px;
}

@media screen and (max-width: 665px) {
  .content {
    overflow-y: scroll
  }
}

#wrapper {
  width: 64em;
  max-width: calc(100% - 4em);
  margin: 0 auto
}

@media screen and (max-width: 480px) {
  #wrapper {
    max-width: calc(100% - 2em)
  }
}

.downloads a, .gallery a {
  border-bottom: none
}

div[uk-lightbox] a {
  border-bottom: none;
}

#wrapper a:hover {
  text-decoration: none
}

.slide img {
  object-fit: contain;
  width: 100%;
  height: 100px;
  max-width: 150px;
  filter: grayscale(100%);
  -moz-transition: filter .2s ease;
  -webkit-transition: filter .2s ease;
  -ms-transition: filter .2s ease;
  transition: filter .2s ease
}

.slide img:hover {
  filter: grayscale(0)
}

.slide a {
  border-bottom: none
}

.slide {
  flex-shrink: 1
}

.slide-track {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 2em;
  overflow: hidden
}

#footer .slider {
  width: 100%;
  margin-top: 3em
}

#footer .slider h3 {
  text-align: center
}

.uk-navbar-container {
  top: var(--admin-bar--height, 0);
  margin-top: calc(-1 * var(--admin-bar--height, 0));
}
