/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Accessibility
# Navigation
  ## Links
  ## Menus
# Breadcrumbs
# Footer
  ## Widgets
  ## Social Links
  ## Sitemap
  ## Brands
  ## Legal
# Layout
# Alignments
# Clearings
# Components
# Content
  ## Posts and pages
  ## Archive
  ## Single
  ## Comments
  ## Shortcode
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/

.archive .content-area {
  padding: 2rem 0;
}

/* Text meant only for screen readers. */

.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

.screen-reader-text:focus {
  background-color: var(--grey-99);
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: var(--grey-5);
  display: block;
  font-size: 1em;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 1em 1.5em;
  text-decoration: none;
  top: .5em;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */

#content[tabindex="-1"]:focus {
  outline: 0;
}

/*--------------------------------------------------------------
# Header (Navigation)
--------------------------------------------------------------*/

body {
  padding-top: 8.25rem;
  background-color: var(--grey-95);
}

body.page-home {
  padding-top: 5rem;
}

#masthead {
  z-index: 999;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  will-change: transform;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: -webkit-transform 0.25s ease-in-out;
  transition: -webkit-transform 0.25s ease-in-out;
  -o-transition: transform 0.25s ease-in-out;
  transition: transform 0.25s ease-in-out;
  transition: transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
}

#masthead.nav-up {
  -webkit-transform: translateY(-5rem);
      -ms-transform: translateY(-5rem);
          transform: translateY(-5rem);
}

.sub-navigation {
  z-index: 9;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

.technology-of a {
  display: block;
  height: 29px;
  width: 124px;
  background-image: url(../images/technology-of-logo.svg);
  text-indent: 9999px;
  overflow: hidden;
  padding: 0;
  white-space: nowrap;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.site-header {
  width: 100%;
  z-index: 99;
  transition: background 0.25s linear;
}

.site-header .site-branding a {
  display: inline-block;
}

.site-header .site-branding img {
  position: relative;
  display: block;
  width: auto;
  height: 3.5rem;
  z-index: 99;
}

.main-navigation, .sub-navigation {
  display: flex;
  padding: 0 1em;
  font-size: .75em;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.menu-item.estore {
  text-transform: initial;
}

.main-navigation {
  font-size: .875em;
}

@media (min-width: 1200px) {
  .main-navigation, .sub-navigation {
    align-items: center;
  }
  .navigation-list {
    display: none;
  }
}

.main-navigation {
  height: 5rem;
  background: white;
  background: var(--white-pure);
}

.sub-navigation {
  height: 3.25rem;
  margin: 0;
  background: rgba(252, 252, 253, 1);
  border-top: 1px solid rgba(58, 69, 69, 0.2);
  box-shadow: 4px 4px 8px rgb(73 77 80 / 15%);
}

.main-navigation .site-wrapper, .nav-menu, .sub-navigation .site-wrapper, .sub-navigation-list {
  flex: 1;
}

.nav-menu, .sub-navigation-list {
  margin: 0;
  padding: 0;
  text-align: center;
  list-style: none;
}

.sub-navigation-list {
  flex: 0 0 50%;
  max-width: 50%;
}

.main-navigation-list {
  min-width: 50%;
}

.secondary-navigation-list {
  text-align: right;
}

.nav-menu li, .sub-navigation-list li {
  display: inline-flex;
  margin: 0 1%;
}

.nav-menu li a,
.sub-navigation-list li a {
  display: inline-block;
  text-decoration: none;
  padding: 7px 8px 5px;
  margin: auto;
}

.nav-menu li a:after,
.sub-navigation-list li a:after {
  content: "";
  width: 0%;
  height: 1px;
  background-color: var(--grey-5);
  display: block;
  margin-top: 4px;
  opacity: 0;

  transition: width .25s ease-in-out;
  -webkit-transition: width .25s ease-in-out;
}

.nav-menu li a:hover:after,
.sub-navigation-list li a:hover:after {
  width: 100%;
  opacity: 1;
}

li.current_page_item>a:after,
li.current-menu-item>a:after,
li.current-page-ancestor>a:after,
li.current_page_parent>a:after {
  width: 50%;
  opacity: 1;
}

.sub-navigation-list li a:hover:after,
.sub-navigation-list li.current_page_item>a:after,
.sub-navigation-list li.current-menu-item>a:after,
.sub-navigation-list li.current-page-ancestor>a:after,
.sub-navigation-list li.current_page_parent>a:after {
  opacity: .4;
}

.site-header .site-wrapper,
.sub-navigation .site-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 3rem;
  margin-top: 0;
  z-index: 11;
}

.main-navigation .site-wrapper {
    height: 5rem;
}

.main-navigation .menu-toggle {
  display: none;
  cursor: pointer;
  text-align: right;
  background: none;
  border: none;
  transition: none;
  padding: 0;
  z-index: 999;
  display: none;
  color: var(--grey-5);
}

.main-navigation .menu-toggle::after {
  content: "\2630";
  font-size: 1rem;
}

.main-navigation .menu-toggle::before {
  content: "Menu";
  margin-right: 1em;
}

.sub-navigation .sub-menu-toggle {
  background: transparent;
  border: none;
  padding: 0 1rem;

}

.sub-navigation .sub-menu-toggle::after {
  border-bottom-style: solid;
  border-bottom-width: 2px;
  border-right-style: solid;
  border-right-width: 2px;
  content: '';
  display: inline-block;
  height: .75rem;
  width: .75rem;
  transform: rotate(45deg);
  transition: transform 1s ease 0.1s;
}

.sub-menu-visible .sub-navigation .sub-menu-toggle::after {
  transform: rotate(-135deg);
}

.anchor {
  position: relative;
  top: -12rem;
  visibility: hidden;
}

@media (min-width: 1200px) {
  .sub-navigation .site-wrapper {
    display: none;
  }
}

@media (max-width: 1200px) {
  body.menu-visible {
    overflow-y: scroll;
    position: fixed;
    width: 100%;
  }

  .main-navigation {
    display: block;
  }

  .secondary-navigation-list,
  .sub-navigation-wrapper {
    display: none;
  }

  .main-navigation .secondary-navigation-list {
    padding: 0;
  }

  .main-navigation ul.nav-menu li {
    display: block;
    font-size: 1.5em;
    margin: .15em .5em;
  }

  .main-navigation .menu-toggle {
    display: inline-block;
    padding: 0 1rem;
  }

  .site-header .navigation-list,
  .sub-navigation-list {
    display: flex;
    justify-content: center;
    flex-direction: column;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    padding: 0;
    max-width: 100%;
  }

  .site-header .navigation-list {
    background: var(--white-pure);
  }

  .overlay {
    background: rgba(0,0,0,0);
    position: fixed;
    top: 5rem;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 8;
    visibility: hidden;
    transition: background 1s ease 0.1s, visibility 1s ease 0.1s;
  }

  .sub-menu-visible .overlay {
    background: rgba(0,0,0,0.5);
    right: 0;
    bottom: 0;
    visibility: visible;
  }

  body.menu-visible .site-header .navigation-list {
    height: auto;
  }

  .sub-navigation {
    opacity: 1;
    visibility: visible;
    transition: opacity 1s ease 0.1s, visibility 1s ease 0.1s;
  }

  /* body.menu-hidden .sub-navigation {
    transition: opacity 1s ease 0.1s, visibility 1s ease 0.1s;
  } */

  body.menu-visible .sub-navigation {
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease 0.1s, visibility 1s ease 0.1s;
  }

  body.menu-hidden #masthead {
    animation: slideUp 1s 1;
    animation-fill-mode: none, forwards;
  }

  body.menu-visible #masthead {
    animation: dropDown 1s 1;
    animation-fill-mode: forwards;
  }

  @keyframes slideUp {
    0% {
      height: 100%;
      z-index: 9;
    }
    30% {
      height: 100%;
    }
    100% {
      height: 5rem;
      z-index: 10;
    }
  }

  @keyframes dropDown {
    0% {
      height: 5rem;
    }
    100% {
      height: 100%;
    }
  }

  .nav-menu li, .sub-navigation-list li {
    visibility: hidden;
  }

  body.menu-hidden .nav-menu li,
  .sub-menu-hidden .sub-navigation-list li {
    animation: fadeOut 1s 1;
    animation-fill-mode: forwards;
  }

  body.menu-visible .nav-menu li,
  .sub-menu-visible .sub-navigation-list li {
    animation: fadeIn 1s 1;
    animation-fill-mode: forwards;
  }

  @keyframes fadeOut {
    0% {
      opacity: 1.0;
      visibility: visible;
    }
    30% {
      opacity: 0.0;
    }
    100% {
      opacity: 0.0;
    }
  }

  @keyframes fadeIn {
    0% {
      opacity: 0.0;
    }
    60% {
      opacity: 0.0;
    }
    100% {
      opacity: 1.0;
      visibility: visible;
    }
  }

  .sub-menu-visible .sub-navigation {
    animation: dropDownSub 1s 1;
    animation-fill-mode: forwards;
  }

  .sub-menu-hidden .sub-navigation {
    animation: slideUpSub 1s 1;
    animation-fill-mode: forwards;
  }

  @keyframes dropDownSub {
    0% {
      height: 3rem;
    }
    100% {
      height: 50vh;
    }
  }

  @keyframes slideUpSub {
    0% {
      height: 50vh;
    }
    30% {
      height: 50vh;
    }
    100% {
      height: 3rem;
    }
  }

}

@media (max-width: 600px) {
  .main-navigation,
  .sub-navigation {
    padding: 0 1rem;
  }
  .main-navigation, .sub-navigation {
    font-size: 12px;
  }
}

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumb {
  font-size: 12px;
  text-transform: uppercase;
  display: flex;
  z-index: 1;
  flex: 0 0 25%;
  max-width: 25%;
}

.single-post .breadcrumb,
.single-project_page .breadcrumb,
.single-portfolio_page .breadcrumb {
  flex: 0 0 100%;
  max-width: 100%;
}

.breadcrumb .container {
  display: inline-flex;
}

.breadcrumb .home-link,
.breadcrumb .arrow-button-container,
.breadcrumb .breadcrumb-item {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.breadcrumb .arrow-button-container {
  margin: 0 8px;
}

.breadcrumb svg.home-icon-svg {
  width: 16px;
  height: 16px;
  fill: none;
  vertical-align: middle;
  stroke: #bdb1b1;
}

.breadcrumb svg.arrow-svg {
  height: 10px;
  width: 6px;
  fill: none;
  stroke: #0000009c;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.5;
}

.breadcrumb .breadcrumb-item {
  width: auto;
  font-family: var(--body-font);
  font-weight: 400;
}

.breadcrumb .breadcrumb-item:not(:last-child) {
  text-transform: none;
}

.breadcrumb .breadcrumb-item a {
  margin-top: 5px;
}

.breadcrumb .breadcrumb-item a:after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--grey-5);
  display: block;
  margin-top: 4px;
  opacity: 0;
}

.breadcrumb .breadcrumb-item a:hover:after {
  opacity: 1;
}

.home .breadcrumb {
  display: none;
}

@media (max-width: 1200px) {
  .breadcrumb {
    display: none;
  }

  .single-post .sub-navigation,
  .single-project_page .sub-navigation,
  .single-portfolio_page .sub-navigation {
    display: none;
  }
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

.site-footer {
  flex-shrink: 0;
  padding-top: 1rem;
  background-color: var(--grey-99);
}

.archive .site-footer
.single-project_page .site-footer {
  margin-top: 128px;
}

/*--------------------------------------------------------------
## Widgets
--------------------------------------------------------------*/

.widget select {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Social Links
--------------------------------------------------------------*/

.social {
  margin: 64px auto;
  display: flex;
  align-items: center;
}

.social-navigation {
  margin: 0 24px;
}

.social-navigation ul.social-links-menu {
  margin: 0;
  padding: 0;
}

.social-navigation ul.social-links-menu li {
  display: inline-block;
  vertical-align: bottom;
  vertical-align: -webkit-baseline-middle;
  list-style: none;
  margin-right: 2rem;
}

.social-navigation ul.social-links-menu li a {
  border-bottom: 1px solid transparent;
  display: block;
  color: var(--grey-30);
  margin-bottom: -1px;
  transition: opacity .25s ease-in-out;
}

.social-navigation ul.social-links-menu li a:hover svg,
.social-navigation ul.social-links-menu li a:active svg {
  opacity: .5;
}

.social-navigation ul.social-links-menu li a svg {
  display: block;
  width: 2.75em;
  height: 2.75em;
  transform: translateZ(0);
}

.social svg {
  transition: fill .25s ease-in-out;
  fill: currentColor;
}

.text-right {
  max-width: 50%;
  width: 100%;
  margin: 0 24px;
  text-align: right;
}

@media (max-width: 1200px) {
  .social {
    height: 8rem;
    justify-content: space-around;
    flex-direction: column;
  }
  .social>* {
    margin: 1em 0;
    text-align: center;
  }
  .social-navigation ul.social-links-menu li {
    margin: 0 1rem;
  }
}

@media (max-width: 600px) {
  .social {
    height: 14rem;
  }
}

/*--------------------------------------------------------------
## Sitemap
--------------------------------------------------------------*/

.sitemap {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 0 1rem;
  max-width: 1168px;
  margin: auto;
}

@media (max-width: 900px) {
  .sitemap {
    grid-template-columns: repeat(2, 1fr);
  }
}

.sitemap ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sitemap ul li {
  margin: 24px 0;
  padding: 0 16px;
}

.sitemap .widget-title {
  font-family: "Spartan";
  font-size: 26px;
  line-height: 36px;
  font-weight: 400;
  letter-spacing: -1.3px;
  color: var(--grey-30);
  padding-left: 16px;
  color: var(--grey-30);
}

.sitemap .widget a {
  color: var(--grey-5);
  text-decoration: none;
}

.sitemap .widget a:hover {
  color: var(--grey-50);
}

@media (max-width: 600px) {
  .sitemap ul {
    line-height: 2rem;
  }
}

/*--------------------------------------------------------------
## Legal
--------------------------------------------------------------*/

.legal {
  border-top: 1px solid #F2F2F3;
  padding-top: 24px;
  margin: 64px 0 0;
  text-align: center;
}

.legal a {
  position: relative;
  margin: 0 16px;
  color: var(--blue-45);
}

.legal a:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  left: 0;
  top: 26px;
  background-color: var(--blue-85);
}

.legal a:hover {
  color: var(--grey-30);
}

.legal a:hover:after {
  background-color: var(--grey-70);
}

.legal .footer-rights {
  margin: 16px 0;
}

/*------------------------------------------------------------*\
 ## EU Cookie law popup
\*------------------------------------------------------------*/

.eupopup-container {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  width: 544px;
  padding: 2rem 3rem;
  background: #fff;
  font-size: .875rem;
  text-align: center;
  z-index: 999;
}

.eupopup-head {
  font-size: 1rem;
  color: #171c1c;
  margin-bottom: 1em;
}

.eupopup-body {
  margin-bottom: 1rem;
}

.eupopup-button {
  display: inline-block;
  padding: 1em;
  text-decoration: none;
}

.eupopup-button_1, .eupopup-button_1:visited {
  background: #ae9150;
  color: #fff;
  padding: .5rem 2rem;
  border-radius: 20px;
}

.eupopup-button_1:hover, .eupopup-button_1:active {
  background: #d1bb88;
  color: #fff;
}

.eupopup-button_2 {
  color: #5f6d6d;
}

.eupopup-closebutton {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  padding: .5rem .75rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  color: #171c1c;
}

@media (max-width: 600px) {
  .eupopup-container {
    width: 100%;
    bottom: 0;
    right: 0;
    left: 0;
    padding: 1rem 1.5rem;
  }
}

/*--------------------------------------------------------------
# Layout
--------------------------------------------------------------*/
.hide {
  display: none;
}

.entry-header > *,
.entry-content > *,
.entry-summary > * {
  width: 100%;
  max-width: 60%;
  margin-left: auto;
  margin-right: auto;
}


.entry-content .alignwide {
  max-width: 80%;
}

@media (max-width: 600px) {
  .entry-content .alignwide {
    max-width: 100%;
  }
}

.entry-content .alignfull {
  max-width: 100%;
  padding: 0 1rem;
}

.entry-content .alignfull.wp-block-image  {
  padding: 0 2rem;
}

.entry-content .alignfull.has-background,
.entry-content .alignfull.media-text {
  padding: 0;
}

.entry-content .alignfull .wp-block-column {
  padding: 1rem;
}

.single .entry-content > p {
  line-height: 1.8;
}

.single .entry-content > p:last-of-type {
  margin-bottom: 2rem;
}

.entry-content > h1+p,
.entry-content > h2+p,
.entry-content > h3+p,
.entry-content > h4+p,
.entry-content > h5+p,
.entry-content > h6+p {
  margin-top: 2rem;
}

.single .post-thumbnail {
  max-width: 100%;
  margin: 3rem auto;
  padding: 0;
}

.single .wp-block-gallery {
  margin-top: 4rem;
  max-width: 100%;
}

.single .wp-block-gallery img {
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 900px) {
  .single .entry-content > p,
  .single .entry-content > h1,
  .single .entry-content > h2,
  .single .entry-content > h3,
  .single .entry-content > h4,
  .single .entry-content > h5,
  .single .entry-content > h6,
  .single .entry-content > blockquote,
  .single .entry-content > ul,
  .single .entry-content > ol,
  .single .entry-content > .wp-block-table {
    max-width: 70%;
  }

  .single-post .entry-header > .entry-meta,
  .single-post .entry-header > .entry-title {
    max-width: 30ch;
  }

  .single .post-thumbnail {
    max-width: 1600px;
  }

  .single .wp-block-gallery {
    max-width: 80%;
  }
}

.single .post-thumbnail img {
  display: flex;
  margin: auto;
}

figure {
  margin: 1em 0 .5em;
}

.wp-block-gallery .blocks-gallery-image figure,
.wp-block-gallery .blocks-gallery-item figure {
  display: block;
  height: auto;
}

.single-post figcaption {
  color: var(--grey-50);
}

.post-thumbnail figcaption {
  display: none;
}

.single h1.entry-title {
    margin-top: 1rem;
    max-width: 100%;
}

article .thumbnail {
  position: relative;
  overflow: hidden;
  background-color: var(--grey-99);
}

article .thumbnail::after {
  content: '';
  display: block;
  padding-top: 56.25%;
}

article picture {
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
}

picture .wp-post-image {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  object-position: 50% 50%;
  transform: none;
  transition: transform 1s;
}

.thumbnail .post-thumbnail {
  display: contents;
}

.col-1-4 {
  flex-basis: calc(100% * 1/4);
}

.col-2-4 {
  flex-basis: calc(100% * 2/4);
}

.col-3-4 {
  flex-basis: calc(100% * 3/4);
}

.wp-block-spacer {
  margin: 0;
}

@media (max-width: 1200px) {

}

@media (max-width: 900px) {
  .entry-content > * {
    max-width: 80%;
  }
  .single-post .entry-content > *,
  .single-portfolio_page .entry-content > * {
    max-width: 100%;
    padding: 0;
  }

  .col-1-4, .col-2-4, .col-3-4 {
    flex-basis: 100%;
  }

}

@media (max-width: 600px) {
  .entry-content .alignfull:not(.cards) .wp-block-column {
    padding: 0;
  }
}

/* Grid */
.grid {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-template-rows: auto;
  grid-auto-flow: dense;
  grid-gap: 2rem;
  max-width: 100%;
}

.page-template-project-template .grid,
.page-template-experience-template .grid {
  margin-bottom: 2rem;
}

.page-media-library .alignfull.grid .wp-block-column {
  padding: 0;
}

@media (min-width: 1200px) {
  .blog .grid,
  .archive .grid,
  .page-template-project-template .grid,
  .page-template-experience-template .grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 900px) {
  .grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .grid.col-3,
  .shortcode.grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 600px) {
  .content-area .grid {
    margin: 0;
  }
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/

.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

img.aligncenter {
  display: block;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/

.clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after {
  content: "";
  display: table;
  table-layout: fixed;
}

.clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after {
  clear: both;
}

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/
.cards .wp-block-column,
.cards .entry {
  border-radius: 4px;
  height: auto;
  padding: 8px 8px 40px;
}

.cards .entry {
  margin: 0;
}

.cards .wp-block-column:not(:empty),
.cards .entry:not(:empty) {
  background: var(--white-pure);
}

.cards .entry:hover {
  box-shadow: 4px 4px 8px rgb(73 77 80 / 15%);
  transition: box-shadow .5s ease;
}

.cards .wp-block-column figure:not(.wp-block-embed),
.cards .entry figure {
  display: block;
  padding-bottom: 56.25%;
  margin: 0;
  position: relative;
  overflow: hidden;
  background-color: var(--grey-99);
}

.cards .wp-block-column figure img,
.cards .entry figure img {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.cards .wp-block-column > *:not(figure),
.cards .entry .entry-header {
  padding: 0 1rem;
}

.cards .entry .entry-header {
  margin-top: 24px;
}

.cards.grid {
  padding: 0 1rem;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/

.page-contact .is-style-text-button .wp-block-button__link {
  margin: 0 0 2rem 0;
}

.single-post .wp-block-column .wp-block-button__link {
  padding: 1em 1em .75em;
}

.byline, .updated:not(.published) {
  display: none;
}

.single .byline, .group-blog .byline {
  display: inline;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

.entry-content ul,
.entry-content ol {
  font-size: var(--text-p);
  line-height: 1.75rem;
  color: var(--grey-30);
}

body:not(.single) .type-post .entry-meta .post-meta-date::after {
  content: ","
}

.archive .page-header {
  width: 100%;
  padding: 0 1rem;
  margin: 2rem 0;
}

.blog #page {
  margin-top: 2rem;
}

.blog .sticky {
  display: flex;
  padding: 0;
  width: 100%;
  align-items: center;
}

.blog .sticky .post-thumbnail-container {
  width: calc(100% * 2/3);
  padding: 1em;
}

.blog .sticky .entry-header {
  width: calc(100% * 1/3);
  text-align: left;
  padding: 1em;
}

.entry-meta {
  margin-top: 2rem;
  font-family: var(--heading-font);
  font-size: .875rem;
}

.entry-meta, .entry-meta a {
  color: var(--grey-50);
}

.tag-container .tag {
  display: inline-block;
  padding: 4px 8px;
  margin-right: 8px;
  margin-bottom: 8px;
  font: bold var(--text-small)/1rem var(--body-font);
  text-transform: uppercase;
  color: var(--grey-50);
  border-radius: 4px;
  border: 1px solid var(--grey-70);
}

.blog .grid {
  padding: 0 1rem;
}

.grid .entry-header > * {
  max-width: 100%;
}

.grid .entry .entry-title {
  margin: .25rem 0;
}

.single-post .entry-header {
  text-align: center;
}

.event-info {
  padding: 0;
  margin: 0 0 2rem;
  list-style: none;
}

.event-info li::before {
  font-family: "dashicons";
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  font-size: 1.5rem;
  vertical-align: sub;
  margin: .25em .5em .25em 0;
}

.event-artist::before {
  content: "\f524";
}

.event-date::before {
  content: "\f145";
}

.event-time::before {
  content: "\f469";
}

.event-location::before {
  content: "\f230";
}

.profile-group,
.profile-group > .wp-block-group__inner-container {
  display: flex;
  flex-wrap: wrap;
}

.profile-group .wp-block-group {
  padding: 0 0 3rem;
  flex-basis: calc(100% /3);
}

.profile-group img {
  width: 100%;
  object-fit: cover;
  object-position: center;
}

.profile-group *+h4 {
  margin-top: 2em;
}

.profile-group *+p {
    padding: 0 10%;
}

.entry-content .wp-block-table table {
  width: 100%;
}

@media (min-width: 1200px) {
  .single-post .has-2-columns .wp-block-column:first-of-type {
    flex-basis: 70%;
  }
  .single-post .has-2-columns .wp-block-column:last-of-type {
    flex-basis: 30%;
    margin-left: 2rem;
  }
}

@media (max-width: 1200px) {
  .profile-group {
    flex-wrap: wrap;
  }
  .profile-group .wp-block-group {
    flex-basis: 50%;
  }
  .single-post .entry-content .wp-block-columns {
    flex-wrap: wrap;
  }
  .single-post .wp-block-columns .wp-block-column {
    margin-left: 0;
    margin-right: 0;
  }
}

@media (max-width: 900px) {
  .blog .post, .archive .post {
    width: 100%;
  }
  .blog .sticky {
    display: block;
  }
  .blog .sticky .post-thumbnail-container, .blog .sticky .entry-header {
    width: 100%;
    text-align: center;
  }
  .blog .sticky .post-thumbnail-container {
    padding-bottom: 0;
  }
  .blog .sticky .entry-header {
    padding-top: 0;
  }
  .single-post .wp-block-columns .wp-block-column:last-of-type {
    margin-top: 3rem;
  }
}

@media (max-width: 600px) {
  .profile-group .wp-block-group {
    flex-basis: 100%;
  }
  .entry-meta, .entry-meta a, .wp-block-button__link {
    font-size: .875rem;
  }
}

/*--------------------------------------------------------------
## Page and post navigation
--------------------------------------------------------------*/

.site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation {
  padding: 2rem 1rem;
  overflow: hidden;
  width: 100%;
}

.comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous {
  float: left;
  width: 50%;
  padding: 0 1rem;
}

.comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next {
  float: right;
  text-align: right;
  width: 50%;
  padding: 0 1rem;
}

.nav-previous a, .nav-next a {
  /*
  text-decoration: none;   */
  display: inline-block;

}

.nav-previous a:hover, .nav-next a:hover, .pagination .current {
  color: var(--grey-50);
}

.pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  padding: 0 1rem;
  margin: 2rem 0;
}

.pagination .nav-links a {
  display: inline-block;
}

.pagination .nav-links a>* {
  margin: 0;
}

.pagination .nav-links>* {
  width: calc(100% /3);
  padding: 1rem;
}

.pagination .nav-links .page-numbers-container {
  display: flex;
  justify-content: space-evenly;
  font-size: 1.625rem;
}

.pagination .nav-links .next-link {
  text-align: right;
}

@media (max-width: 900px) {
  .pagination .nav-links .page-numbers-container {
    display: none;
  }
  .pagination .nav-links>* {
    width: 50%;
  }
}

/*------------------------------------------------------------*\
 # Archive
\*------------------------------------------------------------*/

article > a {
  display: block;
}

article > a:hover img {
    transform: scale(1.025);
}

.not-found {
  text-align: center;
}

.error-404 {
  padding: 6rem 0;
}

/*--------------------------------------------------------------
## Single
--------------------------------------------------------------*/
.single-post article {
  padding: 0 2rem 2rem;
}

.entry-footer {
  padding-bottom: 2em;
}

.tags-links a, .tags-links a:visited {
  display: inline-block;
  font-size: .875rem;
  padding: 0.25em 0.5em 0.05em;
  margin-right: 0.5em;
  border: 1px solid var(--grey-95);
  border-radius: 3px;
  color: var(--grey-50);
}

.tags-links a:hover {
  border-color: var(--grey-70);
}

.sound-space-stats h1 {
  margin-top: 2.25rem;
  white-space: nowrap;
}

.sound-space-stats *+h1 {
  margin-top: .75rem;
}

@media (max-width: 900px) {
  .single .entry-meta {
    max-width: 80%;
  }
  .grid .entry-header > * {
    max-width: 100%;
  }
}

@media (max-width: 600px) {
  .tags-links a, .tags-links a:visited {
    font-size: 1rem;
  }
  .single-post article {
    padding: 0 1rem 2rem;
  }
}

.media-text {
  align-items: center;
  background-color: var(--grey-99);
  margin: 0;
}

.media-text .wp-block-column {
  flex-basis: 50%;
}

.media-text .wp-block-column:first-child {
  padding: 0;
}

.media-text .wp-block-column:last-child {
  padding: 3rem 2rem;
  margin: auto;
  max-width: 70ch;
  justify-self: center;
}

.media-text.has-black-background-color {
  background-color: var(--grey-5);
}

.animation .wp-block-column:first-of-type {
  background-color: var(--grey-99);
}

.media-text figure {
  margin: 0;
}

/*--------------------------------------------------------------
## Home
--------------------------------------------------------------*/

/*.home video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}*/

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/

.comment-content a {
  word-wrap: break-word;
}

.bypostauthor {
  display: block;
}

/*--------------------------------------------------------------
## Shortcode
--------------------------------------------------------------*/

.shortcode.grid {
  padding: 0 1rem;
}

.shortcode article {
  margin: 0;
}

@media (max-width: 1200px) {
  .shortcode {
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  .shortcode.post-3 article,
  .shortcode.post-6 article,
  .shortcode.post-2 article,
  .shortcode.post-4 article {
    width: 100%;
  }
}

@media (max-width: 600px) {
  .shortcode {
    padding: 0;
  }
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/

a img {
  display: block;
}

.page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure embeds and iframes fit their containers. */

embed, iframe, object {
  max-width: 100%;
}

article .video-wrapper {
  max-width: 1600px;
  margin: 3rem auto;
}

.video-wrapper {
  position: relative;
  overflow: hidden;
  background-color: var(--grey-99);
}

.video-wrapper::after {
  content: '';
  display: block;
  padding-top: 56.25%;
}

.video-wrapper iframe,
.video-wrapper video {
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  border: none;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/

.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption .wp-caption-text {
  margin: .75em 0;
}

.wp-caption-text {
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/

.gallery {
  margin-bottom: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}

.gallery-columns-2 .gallery-item {
  max-width: 50%;
}

.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
  max-width: 25%;
}

.gallery-columns-5 .gallery-item {
  max-width: 20%;
}

.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-caption {
  display: block;
}

.ppms_cm_popup_overlay .ppms_header_wrapper .ppms_cm_language_select_btn,
.ppms_cm_popup_overlay .ppms_header_wrapper .ppms_cm_language_select_extendable_item {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_header_wrapper .ppms_cm_language_select_btn:hover,
.ppms_cm_popup_overlay .ppms_header_wrapper .ppms_cm_language_select_extendable_item:hover {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_header_wrapper .ppms_cm_language_select_btn:focus,
.ppms_cm_popup_overlay .ppms_header_wrapper .ppms_cm_language_select_extendable_item:focus {
  font-family: var(--body-font) !important;
  border: none !important;
}
.ppms_cm_popup_overlay .ppms_cm_popup_wrapper .ppms_cm_header1 {
  font-family: var(--heading-font) !important;
  margin: 0 0 25px !important;
  font-weight: 400 !important;
}
.ppms_cm_popup_overlay .ppms_cm_popup_wrapper .ppms_cm_header1:hover {
  font-family: var(--heading-font) !important;
  font-weight: 400 !important;
  margin: 0 0 25px !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_paragraph,
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_consents_list {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_paragraph:hover,
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_consents_list:hover {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_paragraph .ppms_cm_consent_item .ppms_cm_consent_item-text,
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_consents_list .ppms_cm_consent_item .ppms_cm_consent_item-text {
  font-family: var(--body-font) !important;
  font-weight: 600 !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_paragraph .ppms_cm_consent_item .ppms_cm_consent_item-text:hover,
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_consents_list .ppms_cm_consent_item .ppms_cm_consent_item-text:hover {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_paragraph .ppms_cm_consent_item:hover,
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_cm_consents_list .ppms_cm_consent_item:hover {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_agree_button_wrapper .ppms_cm_agree-to-all {
  background-color: var(--grey-5) !important;
  box-shadow: 2px 2px 6px var(--grey-30) !important;
  border-radius: 4px !important;
  height: 40px !important;
  text-align: center !important;
  border: none !important;
  color: var(--grey-95) !important;
  font-family: var(--body-font) !important;
  margin-bottom: 20px !important;
  font-size: 16px !important;
  padding: 10px 0 !important;
}
.ppms_cm_popup_overlay .ppms_cm_main_content .ppms_agree_button_wrapper .ppms_cm_reject-all {
  background-color: transparent !important;
  height: 40px !important;
  text-align: center !important;
  border: none !important;
  color: var(--grey-5) !important;
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_show_btn,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_link,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_hide_btn {
  font-family: var(--body-font) !important;
  color: var(--grey-5) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_show_btn:hover,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_link:hover,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_hide_btn:hover {
  font-family: var(--body-font) !important;
  color: var(--grey-5) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_show_btn.expanded,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_link.expanded,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_hide_btn.expanded {
  font-family: var(--body-font) !important;
  color: var(--gold-45) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_show_btn.expanded:hover,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_link.expanded:hover,
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_content_expander_hide_btn.expanded:hover {
  font-family: var(--body-font) !important;
  color: var(--grey-5) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_consent_switcher {
  background: var(--grey-5) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_consent_switcher:hover {
  background: var(--grey-5) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_consent_switcher.checked {
  background: var(--gold-45) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_consent_switcher.checked:hover {
  background: var(--gold-45) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_header4 {
  font-family: var(--heading-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_header4:hover {
  font-family: var(--heading-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_span {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_span:hover {
  font-family: var(--body-font) !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_save-choices {
  background-color: var(--grey-5) !important;
  box-shadow: 2px 2px 6px var(--grey-30) !important;
  border-radius: 4px !important;
  height: 40px !important;
  text-align: center !important;
  border: none !important;
  color: var(--grey-95) !important;
  font-family: var(--body-font) !important;
  margin-bottom: 20px !important;
  font-size: 16px !important;
  padding: 0 10px !important;
}
.ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_save-choices:hover, .ppms_cm_popup_overlay .ppms_cm_data_uses .ppms_cm_save-choices:focus {
  border-radius: 4px !important;
  height: 40px !important;
  text-align: center !important;
  border: none !important;
  color: var(--grey-95) !important;
  font-family: var(--body-font) !important;
  margin-bottom: 20px !important;
  font-size: 16px !important;
  padding: 0 10px !important;
}
.ppms_cm_popup_overlay .ppms_cm_footer {
  display: none !important;
}

#ppms_cm_popup_content .ppms_cm_main_text {
  font-family: var(--body-font) !important;
}
#ppms_cm_popup_content .ppms_cm_main_text:hover {
  font-family: var(--body-font) !important;
}
#ppms_cm_popup_content .ppms_cm_set_your_consent {
  background-color: var(--grey-5) !important;
  box-shadow: 2px 2px 6px var(--grey-30) !important;
  border-radius: 4px !important;
  text-align: center !important;
  border: none !important;
  color: var(--grey-95) !important;
  font-family: var(--body-font) !important;
  margin-bottom: 20px !important;
  font-size: 16px !important;
  padding: 10px 20px !important;
}
#ppms_cm_popup_content .ppms_cm_set_your_consent:hover, #ppms_cm_popup_content .ppms_cm_set_your_consent:focus {
  border-radius: 4px !important;
  text-align: center !important;
  border: none !important;
  color: var(--grey-95) !important;
  font-family: var(--body-font) !important;
  margin-bottom: 20px !important;
  font-size: 16px !important;
  padding: 10px 20px !important;
}