/*
Theme Name: Blocksy Child
Template: blocksy
*/
@font-face {
    font-family: 'Effra';
    src: url('assets/font/effra-webfont/Effra_Std_Rg.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;

}

body {
    font-family: 'Effra' !important; 
}
:root {
    --theme-font-family: 'Effra' !important;
    --theme-font-weight: 400;
}
h1, h2, h3 {
      --theme-font-weight: 400 !important;
}

body.home .site-branding {
  opacity: 0;
}

.ct-panel-inner {
    background-color: #6c6c6c !important;
}

#header [data-device="mobile"] .ct-sticky-container .site-branding {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.site-branding a {
	background: url("assets/img/logo.svg") no-repeat;
	background-size: 140px auto;
	padding-left: 140px;
	display: block;
	text-indent: -99999px;
	height: 70px;
}


.home .ct-container-full {

  padding-top: 0 !important;
  padding-bottom: 0 !important;

}
article.post-86, article.post-86 .entry-content.is-layout-constrained {
  height: 100%;
  position: relative;
}



article.post-86 .logo-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 100%);
}
@media screen and (min-width: 768px) {
  article.post-86 .logo-wrap {
    transform: translate(-50%, 50%);
  }
}
@media screen and (min-width: 1024px) {
  article.post-86 .logo-wrap {
    transform: translate(-50%, 20%);
  }
}


/*
 * Person Overview Page
 */
.person-overview-grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
}


/**/
.person-teaser {
  width: 100%;
  overflow: hidden;
  margin-bottom: 1rem;
}
@media screen and (min-width: 768px) {
  .person-teaser {
    width: 47%;
  }
  .person-teaser:nth-child(even) {
    margin: 0 0 0 6%;
  }
}
@media screen and (min-width: 1024px) {
  .person-teaser {
    width: 30%;
  }
  .person-teaser:nth-child(even) {
    margin: 0 5%;
  }
}

/*
.person-teaser a {
  display: block;
  width: 100%;
  color: var(--theme-text-color);
}

.person-teaser a:hover {
  display: block;
  width: 100%;
  color: var(--theme-text-color);
}
*/
.person-teaser img {
  filter: grayscale(60%);
  transition: filter 0.4s ease, transform 0.4s ease;
  width: 100%;
  height: auto;
  display: block;
  transform: scale(1.02);
}

.person-teaser:hover img {
  filter: grayscale(60%);
  transform: scale(1.01);
}


.person-teaser .person_image_overlay {
  padding: 1rem 0.5rem 0.5rem 0.5rem;
}

.person-teaser .person_image_overlay h2 {
  font-size: 1.2rem;
  font-weight: 400;
  margin-bottom: 0;
}





/*
 * Project Overview Page
 */
.project-overview-grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}


/**/
.project-teaser {
  width: 100%;
  overflow: hidden;
  margin-bottom: 1rem;
}
@media screen and (min-width: 768px) {
  .project-teaser {
    width: 47%;
  }
}
@media screen and (min-width: 1024px) {
  .project-teaser {
    width: 30%;
  }
}


.project-teaser a {
  display: block;
  width: 100%;
  color: var(--theme-text-color);
}

.project-teaser a:hover {
  display: block;
  width: 100%;
  color: var(--theme-text-color);
}

.project-teaser img {
  filter: grayscale(60%);
  transition: filter 0.4s ease, transform 0.4s ease;
  width: 100%;
  height: auto;
  display: block;
    transform: scale(1.02);
}

.project-teaser:hover img {
  filter: grayscale(0%);
  transform: scale(1.01);
}


.project-teaser a .project_image_overlay {
  padding: 1rem 0.5rem 0.5rem 0.5rem;
}

.project-teaser a .project_image_overlay h2 {
  font-size: 1.2rem;
  font-weight: 400;
  margin-bottom: 0;
}



/*
 * Project Detail Page
 */

.project-detail {}

.project-detail h2 {
  font-size: 1.5rem;
}
.project-main-image {
  margin: 0 0 1rem 0;
}

@media screen and (max-width: 767px) {
  .hero-section.is-width-constrained {
    margin-bottom: 0.8rem !important;
  }

}

/* Main Image */
@media screen and (min-width: 768px) {
  .project-main-image {
    display: inline-block;
    max-width: 50%;
    float: left;
    margin: 0 2% 0 0;
  }
  .project-task-description {
    width: 48%;
    float: right;
  }
}


/*
 * Project Gallery on Detail Page
 */
.project-gallery-container {
  clear: both;
  padding-top: 2rem;
}


.project-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 3rem;
}

.project-gallery img {
  width: 100%;
  height: auto;
  display: block;
}



:root {
  --logo-animation-duration: 7s;
  --logo-animation-stagger: 0.16s;
  --logo-stroke: #999;
  --logo-stroke-width: 0.12;
}

.logo-wrap {
  width: min(900px, 90vw);
  margin-inline: auto;
}

.svg-write-logo svg {
  width: 100%;
  height: auto;
  overflow: visible;
}

.svg-write-logo .write-line {
  fill: none !important;

  stroke: var(--logo-stroke) !important; 
  stroke-width: var(--logo-stroke-width) !important;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 1 !important;
  fill-opacity: 1 !important;
  animation-name: logo-draw;
  animation-duration: var(--logo-animation-duration);
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}
.svg-write-logo .st0.write-line {
  fill: none !important;
  stroke: #ff6666 !important;

}


@keyframes logo-draw {
  to {
    stroke-dashoffset: 0;
  }
}

@media screen and (min-width: 768px) {
  .glightbox-clean .gslide-description {
    background: rgba(255, 255, 255, 0.6);
    height: 40px;
  }

  .glightbox-clean .gdesc-inner {
    padding: 0.5rem;
    margin-top: -38px;
    background: rgba(255, 255, 255, 0.6);  
  }

  .glightbox-clean .gslide-title {
    margin-bottom: 0 !important;
  }
}