
#over-ons-intro{
  position: relative;
  top: -52px;
  z-index: -2;
  overflow: hidden;
  background-color: #e5e5e5;/*#b7cbe2;*/
}
.container-fluid.intro-page{
  padding-right: 0;
  padding-left: 0;
}
#over-ons-intro-text-animation {
  position: absolute;
  width: 100%;
  max-width: 1440px;
  height: 100vh;
  margin: auto;
}
#over-ons-intro-text-animation h1 {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: inline-block;
  transform: translate(-50%,-50%);
  margin: 0;
  color: var(--color-zarazzo-red);
  /*color: white;*/
}
.over-ons-intro-img{
  position: absolute;
}
#over-ons-intro #kopjes {
  position: absolute;
  top: 0;
  left: 50%;
  max-width: 1440px;
  transform: translateX(-50%);
}
:root {
--zarazzo-intro-over-scale: 1;
}
#kopje-06 {
/*  top: -10%;
  left: 22%;*/
  top: -40%;
  left: 12%;
  transform: rotate(120deg) scale(var(--zarazzo-intro-over-scale));
}
#kopje-05 {
/*  top: -6%;
  left: 49%;*/
  top: -50%;
  left: 55%;
  transform: rotate(60deg) scale(var(--zarazzo-intro-over-scale));
}
#kopje-04 {
/*  top: 44%;
  left: 5%;*/
  top: 100%;
  left: -16%;
  transform: rotate(20deg) scale(var(--zarazzo-intro-over-scale));
}

#kopje-03 {
/*  top: 25%;
  left: 5%;*/
  top: 20%;
  left: -50%;
  transform: rotate(-80deg) scale(var(--zarazzo-intro-over-scale));
}
#kopje-02 {
/*  top: 67%;
  left: 57%;*/
  top: 100%;
  left: 95%;
  transform: rotate(20deg) scale(var(--zarazzo-intro-over-scale));
}
#kopje-01 {
/*  top: 29%;
  left: 69%;*/
  top: 31%;
  left: 140%;
  transform: rotate(20deg) scale(var(--zarazzo-intro-over-scale));
}

@media only screen and (max-width: 767px) {
  #over-ons-intro .full-width-height-header {
    height: 360px;
  }

  #over-ons-intro #kopjes {
    min-width: 500px;
    height: 360px;
  }
  #kopje-03 {
    display: none;
  }
}
