/*
 Theme Name:     Imaginary Child
 Theme URI:      https://www.mielikuvitussivut.fi
 Description:    Divi Child Theme
 Author:         Anri
 Author URI:     https://mielikuvitustoimisto.fi
 Template:       Divi
 Version:        1.0.2
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */

/* Animated dots for logo */
.wg-logo-dots-stage{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:5;
}
.wg-logo-dots-stage span{
  position:absolute;
  width:4.05%;
  aspect-ratio:1;
  border-radius:50%;
  background:#F15A24;
  display:block;
  opacity:.28;
  transform:scale(.78);
  animation:wgProgressFill 3s ease-in-out infinite;
}
.wg-logo-dots-stage span:nth-child(1){left:78.51%;top:93.04%;animation-delay:0s;}
.wg-logo-dots-stage span:nth-child(2){left:87.21%;top:93.04%;animation-delay:.5s;}
.wg-logo-dots-stage span:nth-child(3){left:95.91%;top:93.04%;animation-delay:1s;}
@keyframes wgProgressFill{
  0%{opacity:.28;transform:scale(.78);}
  12%,68%{opacity:1;transform:scale(1);}
  88%,100%{opacity:.28;transform:scale(.78);}
}

/* Working group icons */
:root{--g:#8CC63F;}
.wg-icon-box{position:relative;width:100%;aspect-ratio:235/140;}
.wg-icon-box svg{position:absolute;inset:0;width:100%;height:100%;display:block;}
.wg-dot{position:absolute;width:14.468%;aspect-ratio:1;border-radius:50%;background:var(--g);display:block;top:52.143%;}
.wg-dot:nth-child(1){left:9.787%;}
.wg-dot:nth-child(2){left:41.277%;}
.wg-dot:nth-child(3){left:72.766%;}

.kw-baseline{animation:kwBaseline 5s ease-in-out infinite;}
@keyframes kwBaseline{
  0%{stroke-dashoffset:148;opacity:.5;} 60%{stroke-dashoffset:0;opacity:.5;}
  84%{stroke-dashoffset:0;opacity:.5;} 96%{stroke-dashoffset:0;opacity:0;} 100%{stroke-dashoffset:148;opacity:0;}
}

.broadcast .wg-dot{animation:bPulse 2.4s ease-in-out infinite;}
.broadcast .wg-dot:nth-child(2){animation-delay:0s;}
.broadcast .wg-dot:nth-child(1){animation-delay:.25s;}
.broadcast .wg-dot:nth-child(3){animation-delay:.25s;}
.broadcast .wg-dot::before{content:"";position:absolute;inset:-12%;border-radius:50%;border:2px solid var(--g);opacity:0;animation:bRing 2.4s ease-out infinite;}
.broadcast .wg-dot:nth-child(2)::before{animation-delay:0s;}
.broadcast .wg-dot:nth-child(1)::before{animation-delay:.25s;}
.broadcast .wg-dot:nth-child(3)::before{animation-delay:.25s;}
@keyframes bPulse{0%,100%{transform:scale(1);} 12%{transform:scale(1.15);}}
@keyframes bRing{0%{transform:scale(1);opacity:.75;} 100%{transform:scale(2.1);opacity:0;}}

.goo-blend{position:absolute;inset:0;filter:url(#wg-goo);animation:gooBlendFade 4.2s ease-in-out infinite;}
.goo-blend .wg-dot:nth-child(1){animation:gooOuterL 4.2s ease-in-out infinite;}
.goo-blend .wg-dot:nth-child(2){animation:gooOuterR 4.2s ease-in-out infinite;}
@keyframes gooBlendFade{0%{opacity:1;} 45%{opacity:.5;} 58%{opacity:.5;} 100%{opacity:1;}}
@keyframes gooOuterL{
  0%{transform:translate(0,0) scale(1,1);} 45%{transform:translate(217.6%,-11.8%) scale(1.7,2.05);}
  58%{transform:translate(217.6%,-11.8%) scale(1.7,2.05);} 100%{transform:translate(0,0) scale(1,1);}
}
@keyframes gooOuterR{
  0%{transform:translate(0,0) scale(1,1);} 45%{transform:translate(-217.6%,14.7%) scale(2.05,1.7);}
  58%{transform:translate(-217.6%,14.7%) scale(2.05,1.7);} 100%{transform:translate(0,0) scale(1,1);}
}