@charset "UTF-8";
.wrapper {
  padding: 0 24px; }

header {
  position: relative; }
  header .show-menu {
    display: block; }
  header #header #site-name {
    margin-right: 24px;
    font-size: 24px;
    line-height: 28px;
    word-break: break-word; }
  header #header.show-menu {
    padding-bottom: 225px;
    border-bottom: 1px solid #808080; }
  header #header #menu {
    display: none; }
    header #header #menu ul {
      background-color: #000000; }
    header #header #menu.show-menu {
      display: block; }
  header #header #mobile-menu-btn {
    height: 44px;
    width: 44px;
    background: url(../images/icons/menu.svg) no-repeat center;
    background-size: 50%;
    color: #ffffff;
    border: 2px solid #ffffff;
    border-radius: 40px;
    cursor: pointer; }
    header #header #mobile-menu-btn.show-menu {
      background: url(../images/icons/close.svg) no-repeat center; }
  header #header #header-buttons {
    display: none;
    position: absolute;
    bottom: 100px;
    left: 0;
    width: 100%;
    text-align: center;
    padding: 0 24px; }
    header #header #header-buttons.show-menu {
      display: block; }
    header #header #header-buttons form {
      width: auto;
      max-width: 400px;
      margin: 24px auto; }
      header #header #header-buttons form input {
        width: 350px; }
  header #header .social-networks {
    position: absolute;
    bottom: 44px;
    left: 0;
    display: block;
    width: 100%;
    text-align: center; }
    header #header .social-networks > div {
      max-width: 400px;
      width: auto;
      margin: auto;
      padding: 0 24px; }
    header #header .social-networks .social.small {
      margin-left: 0; }
      header #header .social-networks .social.small, header #header .social-networks .social.small svg {
        width: 24px;
        height: 24px; }

#intro:after {
  margin-top: 64px; }
#intro .buttons {
  display: block; }
  #intro .buttons a {
    text-align: center;
    display: block;
    margin: 10px auto 10px auto;
    width: max-content; }
#intro h1 {
  font-size: 52px;
  line-height: 60px; }

#latest h2 {
  margin-top: 80px;
  font-size: 40px;
  line-height: 68px; }

ul.blog-list {
  background: none;
  display: block;
  margin-top: 96px; }
  ul.blog-list:before {
    top: -64px; }
  ul.blog-list li {
    margin-top: 64px !important;
    padding: 0; }
    ul.blog-list li .article {
      padding: 0;
      width: auto;
      max-width: 400px; }
      ul.blog-list li .article .head {
        height: auto;
        display: block; }
        ul.blog-list li .article .head .date {
          height: auto;
          display: block;
          padding: 0;
          margin-top: 8px; }
          ul.blog-list li .article .head .date > span {
            writing-mode: lr;
            transform: rotate(0); }

#featured {
  padding-top: 80px; }
  #featured > .flex {
    display: block; }
    #featured > .flex > div:nth-child(2) {
      display: none; }
  #featured a.button {
    text-align: center;
    display: block;
    margin: 10px auto 10px auto;
    width: max-content; }
  #featured:after {
    margin-top: 80px; }

.events {
  position: relative; }
  .events:after {
    margin-top: 160px; }
  .events .event-item {
    flex-wrap: wrap;
    max-width: 400px;
    margin: auto;
    padding: 24px;
    min-height: 160px;
    height: auto; }
    .events .event-item > span:nth-child(4) {
      display: none; }
    .events .event-item .details {
      display: block;
      width: 100%;
      margin-top: 24px; }
    .events .event-item .date {
      margin-right: 0; }
    .events .event-item .picture {
      margin-right: 0;
      margin-left: auto; }

#main-events {
  padding-top: 64px; }
  #main-events:after {
    margin-top: 180px; }
  #main-events .events-title {
    margin-bottom: 12px; }
    #main-events .events-title h2 {
      display: block;
      text-align: center;
      width: 100%;
      font-size: 40px;
      line-height: 112%; }
      #main-events .events-title h2 svg {
        margin: auto;
        display: block; }
  #main-events #events-all-btn {
    position: absolute;
    bottom: 110px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    width: 200px;
    text-align: center; }

footer > .flex {
  display: block; }
footer .is-half:nth-child(even) {
  border-left: 0; }
footer .is-half ul.sitemap > li {
  margin-bottom: 18px; }
footer .cell {
  padding: 40px 30px; }
footer #spf-description svg {
  width: 96px;
  height: 96px;
  margin-right: 24px; }
footer .social-networks .social {
  margin-left: 0; }
  footer .social-networks .social, footer .social-networks .social svg {
    width: 24px;
    height: 24px; }

header #menu nav > ul {
  display: block;
  height: 100%;
  font-size: 16px;
  font-weight: bold;
  margin-top: 24px; }
  header #menu nav > ul > li {
    margin-bottom: 30px;
    display: block;
    padding: 0; }
    header #menu nav > ul > li.has-children:after {
      display: none; }
    header #menu nav > ul > li ul {
      margin-top: 16px;
      display: block;
      position: inherit; }
      header #menu nav > ul > li ul li {
        display: list-item;
        list-style-type: "✦";
        margin-left: 20px;
        padding: 0 0 0 10px; }

#body, #content #body {
  margin-top: 40px; }

#title-blog {
  padding-top: 40px;
  height: auto; }
  #title-blog .arrow {
    position: relative;
    top: 0; }
    #title-blog .arrow svg {
      width: 48px;
      height: 24px; }
  #title-blog .title {
    position: relative;
    bottom: 0;
    padding: 0; }
    #title-blog .title .title-bottom {
      min-height: auto;
      max-width: 100%; }
      #title-blog .title .title-bottom h1 {
        font-size: 40px;
        width: 100%; }
  #title-blog .image {
    margin-top: 40px;
    text-align: right;
    font-size: 0;
    letter-spacing: 0;
    word-spacing: 0; }
    #title-blog .image div {
      position: relative;
      display: inline-block;
      width: 376px;
      height: 376px;
      border-radius: 180px 0px 0px 0px;
      max-width: 100%; }

#title h1 {
  font-size: 52px; }
#title #dragon {
  display: none; }

#rdr .wrapper {
  display: block; }
#rdr:after {
  margin-top: 80px; }
#rdr a.button {
  text-align: center;
  display: block;
  margin: 30px auto 10px auto;
  width: max-content; }

@media (max-width: 370px) {
  header #logo #circle-logo {
    width: 48px;
    height: 48px; }
    header #logo #circle-logo svg {
      width: 32px;
      margin-top: -5px; }

  #intro h1 {
    font-size: 42px;
    line-height: 48px; }

  #featured h2 {
    font-size: 36px;
    line-height: 42px; } }

/*# sourceMappingURL=mobile.css.map */