/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/


/* Verbergen buiten openingstijden */
#tijdElement.is-hidden {
  display: none;
}

/* Layout */
#tijdElement {
  display: inline-flex;
  align-items: center;
  flex-direction: row;
  gap: 10px;
}

#tijdElement a, #tijdElement span{
  color: #fff;
  text-decoration: none;
  font-size: 14px;
}

#tijdElement .beam{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #22c55e;
  display: inline-block;
  box-shadow: 0 0 0 0 rgba(34,197,94,.55);
  transform: translateZ(0); /* voorkomt soms schokkerige animatie */
  animation: nosLivePulse 3s ease-out infinite;
}

@keyframes nosLivePulse {
  0% {
    transform: scale(0.9);
    box-shadow: 0 0 0 0 rgba(34,197,94,.55);
    opacity: 1;
  }
  60% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(34,197,94,0);
    opacity: 1;
  }
  100% {
    transform: scale(0.9);
    box-shadow: 0 0 0 0 rgba(34,197,94,0);
    opacity: 1;
  }
}

/** ANIMATION STYLES **/

.animate--on-visibility {
  visibility: hidden;
}
.animate--on-visibility.animate__animated {
  visibility: visible;
}

.pos-bg-zoomin{
  overflow: hidden;
  position: relative;
}

.pos-bg-zoomin::before{
  -webkit-animation: zoomin 6s linear 1;
animation: zoomin 6s linear 1;
animation-fill-mode: forwards;
}
.pos-bg-zoomin > *{
  position: relative;
  z-index: 1;
}

/* Zoom in Keyframes */
@keyframes zoomin {
  0% {transform: scale(1.0)}
  100% {transform: scale(1.2);}
}

/** FOOTER STYLES **/

.wp-classic-menu-block ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pos-cut-off-left{
clip-path: polygon(60px 0, 100% 0, 100% 100%, 0 100%, 0 60px);
}

.pos-cut-off-right{
  clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 60px, calc(100% - 60px) 0);
}

.pos-no-scrollbar::-webkit-scrollbar{
      display: none;
  }

.pos-timeline::before{
      content: '';
      position: absolute;
      top: 26px;
      bottom: 26px;
      left: 25px;
      width: 2px;
      background: var(--contrast-3);
}