/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Dec 20 2022 | 10:04:55 */
#whole_rightarm{
  animation:righthand 10s infinite linear; 
  transform-origin:top right;
  transform-box:fill-box;
}
@keyframes righthand{
  0%{
    transform:rotatez(0deg);
  }
  50%{
     transform:rotatez(20deg);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#cup{
  animation:teacup 10s infinite linear;
  z-index:999;
  transform-origin:bottom left;
  transform-box:fill-box;
}

@keyframes teacup{
    0%{
    transform:t(0deg);
  }
  50%{
     transform: translateY(-30px);
      }
  100%{
    transform:rotatez(0deg);
  }
}


#whole_leftarm{
  animation:lefthand 5s infinite linear; 
  transform-origin:top left;
  transform-box:fill-box;
}
@keyframes lefthand{
  0%{
    transform:rotatez(0deg);
  }
  50%{
     transform:rotatez(5deg);
      }
  100%{
    transform:rotatez(0deg);
  }
}


/*BALLON SVG*/

#eerste-cijfer{
  animation: firstnumber 5s infinite linear;
  transform-origin:top right;
  transform-box:fill-box;
}
@keyframes firstnumber{
  0%{
    transform:t(0deg);
  }
  50%{
     transform: translateY(50px);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#tweede-cijfer{
  animation: secondnumber 5s infinite linear;
  transform-origin:top right;
  transform-box:fill-box;
}
@keyframes secondnumber{
  0%{
    transform:t(0deg);
  }
  50%{
     transform: translateY(-40px);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#derde-cijfer{
  animation: tirthnumber 5s infinite linear;
  transform-origin:top right;
  transform-box:fill-box;
}
@keyframes tirthnumber{
  0%{
    transform:t(0deg);
  }
  50%{
     transform: translateY(50px);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#vierde-cijfer{
  animation: fourthnumber 5s infinite linear;
  transform-origin:top right;
  transform-box:fill-box;
}
@keyframes fourthnumber{
  0%{
    transform:t(0deg);
  }
  50%{
     transform: translateY(-40px);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#ballon{
  animation: balloon 5s infinite linear;
  transform-origin:top right;
  transform-box:fill-box;
}
@keyframes balloon{
  0%{
    transform:t(0deg);
  }
  50%{
     transform: translateY(-50px);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#arm{
  animation:rightarm 10s infinite linear; 
  transform-origin:top left;
  transform-box:fill-box;
}
@keyframes rightarm{
  0%{
    transform:rotatez(0deg);
  }
  50%{
     transform:rotatez(-30deg);
      }
  100%{
    transform:rotatez(0deg);
  }
}

#vector_29, #vector_20, #vector_26, #vector_11, #vector_23, #vector_14, #vector_17 {
  animation: color_change, 1s, infinite, alternate;
}
@keyframes color_change{
  0%,71% {fill:none}
  72% {fill:#E6E6E6}
  75%,100% {fill:none}
}
#letter{
  animation:brief 1s linear infinite;
  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -1s);
  animation-fill-mode: both;
}
@keyframes brief{
  to {
    transform: translateY(40px);
  }
}

/*Kerstmuts  */
#bal{
  animation: muts 5s infinite linear; 
  transform-origin: top right;
  transform-box:fill-box;
  transform-style: preserve-3D;
}

@keyframes muts{
  0%{
    transform:rotate(0deg);
  }
  40%{
     transform:rotate(3deg);
      }
  80%{
    transform:rotate(-3deg);
  }
  100%{
    transform:rotate(0deg);
  }
}
@media (max-width: 980px){
  #muts2022{
  	width: 200px!important;
}


.xmas-header , .xmas-header .et_pb_row {
  padding: 0px;
  margin: 0px;
}
 .xmas-header .et_pb_row.et_pb_row_1_tb_header {
display:flex;
}

.xmas-header .et_pb_row.et_pb_row_1_tb_header .et_pb_column.et_pb_column_1_2{
display:flex;
  flex-direction: column;
}
  }