.linie-vertical{position:absolute;top:0;left:0;width:0px;height:0px;background-color:rgba(101,93,64,.8);transition:all .5s cubic-bezier(0.46, 0.03, 0.52, 0.96);}
/*wf-mask*/
.wf-mask{will-change:transform,clip-path;transition:clip-path 1.2s cubic-bezier(0.46, 0.03, 0.52, 0.96); /*;transition-delay:.4s;*/}
.wf-mask.wf-top{clip-path:inset(100% 0 0 0%);}
.wf-mask.wf-right{clip-path:inset(0 100% 0 0%);}
.wf-mask.wf-bottom{clip-path:inset(0 0 100% 0%);}
.wf-mask.wf-left{clip-path:inset(0 0 0 100%);}


.mask-obj { position: relative; overflow: hidden; display: flex; /*align-items: center; justify-content: center;*/ }
.mask-obj img { width: 100%; height: auto; -webkit-transform:translate3d(0,0,0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden;} 


.cromo-parallax.cp-stop{ transform: none!important; transition: all 0s linear!important} 

/*transition delay*/
.transitionDelay-0{transition-delay:0s}
.transitionDelay-05{transition-delay:.5s }
.transitionDelay-10{transition-delay:1s}
.transitionDelay-15{transition-delay:1.5s}
.transitionDelay-20{transition-delay:2.0s} /*startet nach 2 Sekunden*/ 
.transitionDelay-25{transition-delay:2.5s}
.transitionDelay-30{transition-delay:3.0s}
.transitionDelay-35{transition-delay:3.5s}


/* IMG */
.object-fit-cover {object-fit: cover;}
.object-fit-contain {object-fit: contain;}
.object-position-center {object-position: center;}
.object-position-top {object-position: top;}
.object-position-bottom {object-position: bottom;}
.object-position-right {object-position: right;}
.object-position-left {object-position: left;}


@media all and (max-width: 480px) {
	.aspect-ratio-xs-no {aspect-ratio:1/1!important;}	
    .transform-xs-none {transform: none!important;}
    .clip-path-no { clip-path: inherit!important;}
}

/* GLOBALER TRIGGER */
.animation.start .wf-mask {
    clip-path: inset(0 0 0 0);
}


/* NEU (pro Element) */
.xwf-mask.xstart {
    clip-path: inset(0 0 0 0);
}

/* ------------------- Mask-animate --IMG----------------- */
.mask-animate {
  display: block;
  width: 100%;

  -webkit-mask-image: linear-gradient(to top, transparent 0%, black 40%);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  -webkit-mask-position: top;

  mask-image: linear-gradient(to top, transparent 0%, black 40%);
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
  mask-position: top; 
  transition: transform 1.8s ease-out, opacity 1.8s ease-out;
}

/* ------------------- Mask-animate --IMG--END--------------- */