/* Timotheus Schoenmakers Logo animation */ 

#3Laag_1 { margin-top: -5%;}

.cls-1second {fill:#fff !important;}
.cls-1left {fill:#ee322e !important;}

.shadowBar { box-shadow: rgb(14 14 14 / 10%) 0px 40px 16px -20px, rgb(0 0 0) 15px 5px 53px -30px, inset rgb(0 0 0) 2px -20px 53px -30px, inset rgb(0 0 0 / 25%) 0px -20px 18px -4px !important;}

.gradientBlack .wpb_row .row-bg-wrap  {
    background: #161616!important;
    background: linear-gradient(90deg, rgba(22, 22, 22, 1) 0%, rgba(22, 22, 22, 0.87) 58%, rgba(22, 22, 22, 0.29) 100%)!important;
}


/* #logoAnI3 {
    padding-left: 22% !important;
} */
#logoAnI3 h2 {
    padding-left: 52% !important;
    padding-top: 17px;
}
.logoAn h2 {
    font-size: 2.07vw !important;
}


@media screen and (min-width: 800px) and (max-width: 1199px) {
#logoAnI { 
    padding-left: 14% !important;
    padding-right: 14% !important;
}

#logoAnI2 {
    margin-top: -8.15% !important;
    padding-right: 41% !important;
    padding-left: 49% !important;
}

/* #logoAnI3 {
    padding-left: 14% !important;
} */
	#logoAnI3 h2 {
    padding-left: 26% !important;
}
.logoAn h2 {
    font-size: 2.64vw !important;
}

}

@media screen and (min-width: 1px) and (max-width: 799px) {

#3Laag_1 { margin-top: -3%;}

#logoAnI { 
    padding-left: 12% !important;
    padding-right: 12% !important;
}

#logoAnI2 {
    margin-top: -9% !important;
    padding-right: 41% !important;
    padding-left: 48.7% !important;
}

#Laag_1 { margin-top:-2.9%;}
	
/* #logoAnI3 {
    padding-left: 12% !important;
} */
	#logoAnI3 h2 {
    padding-left: 21% !important;
}
.logoAn h2 {
    font-size: 2.75vw !important;
}

.shadowBar { box-shadow:     
    rgb(14 14 14 / 20%) 0px 40px 16px -20px,
    rgb(0 0 0 / 85%) 15px 5px 40px -25px,
    inset rgb(0 0 0 / 75%) 0px -6px 16px -6px,
    inset rgb(0 0 0 / 55%) 0px -4px 8px -2px !important;
}
}

/* Dakje rechts geanimeerd */
.logo .cls-2 {
  fill: #ee322e;
  clip-path: inset(0 0 100% 0);
  animation: revealClip 3s forwards;
  animation-delay: 2s; /* start 1 seconde later */
}

@keyframes revealClip {
  from { clip-path: inset(0 0 100% 0); }
  to   { clip-path: inset(0 0 0 0); }
}

/* video 3DWeb linking */
/* CSS voor de 3D Webanimatie */

.webTekst p {
    color:#615353;
    text-align: right;
}

/* wrapper + canvas responsive */
  .alpha-wrap { position: relative; width: 100%; max-width:300px; }
  .alpha-canvas { display:block; width:100%; max-width:300px; height:100%; background: transparent; }
  .alpha-wrap video { display:none !important; }


  .alpha-link {
  display: block;
  text-decoration: none;
  opacity: 0.85;
}

.alpha-link:hover {
  opacity: 1;
  transition: opacity 180ms ease-in-out;
}

.alpha-link:hover .alpha-wrap {
  transform: scale(1.02);
  transition: transform 400ms ease-in-out;
}


/* Fade out elementen bij unload combi met java*/
.fadeExit {
  transition: opacity 100ms ease;
}
html.is-unloading .fadeExit {
  opacity: 0;
}