@keyframes moveBottom {
  0% {
bottom:-100px;
  }
  100% {
bottom:0px;
  }
}

@keyframes moveTop {
  0% {
top:-100px;
  }
  100% {
top:0px;
  }
}


@keyframes moveLeft{
  0% {
left:-100px;
  }
  100% {
left:0px;
  }
}

@keyframes moveRight{
  0% {
right:-100px;
  }
  100% {
right:0px;
  }
}



@keyframes moveOpacity {
  0% {
opacity:0;
  }
  100% {
opacity:1;
  }
}


.field--name-field-imagescross .field__item:first-child{
position:relative;
opacity:0;
top:-100px;
}

.field--name-field-imagescross .field__item.activee:first-child {
animation: moveTop 1000ms 1 ease,  moveOpacity 500ms 1 ease;
opacity:1;
top:0;
}


@keyframes moveImg {
  0% {
    transform: translate(0%, 10%);
    clip-path: inset(9%);
  }
  100% {
    transform: translate(0px, 0px);
    clip-path: inset(0%);
  }
}

.galerie-row,
.projekt-image,
.paragraph--type--image .paragraph-content-in2,
.paragraph-img-txt-image .field--name-field-image,
.field--name-field-imagescross .field__item:nth-child(2)  {
    translate: none;
    rotate: none;
    scale: none;
    opacity: 1;
    transform: translate(0%, 10%);
    clip-path: inset(9%);
}

.galerie-row.activee,
.projekt-image.activee,
.paragraph--type--image .paragraph-content-in2.activee,
.paragraph-img-txt-image .field--name-field-image.activee,
.field--name-field-imagescross .field__item.activee:nth-child(2){
animation: moveImg 1000ms 1 ease;

    transform: translate(0px, 0px);
    clip-path: inset(0%);
}


.field--name-field-text-right  h2,
.field--name-field-text-right h3,
.field--name-field-text-right hr,
.field--name-field-text-right ul,
.field--name-field-text-right ol,
.field--name-field-text-right p,
#block-drualas-theme-contactus h2,
#block-drualas-theme-contactus p,
.view-header h2,
.node-teaser-projekt,
.paragraph-item-content-link2,
.field--name-field-body h2,
.field--name-field-body h3,
.field--name-field-body hr,
.field--name-field-body ul,
.field--name-field-body ol,
.field--name-field-body p,
.layout-content .field--name-body h2,
.layout-content .field--name-body h3,
.layout-content .field--name-body hr,
.layout-content .field--name-body ul,
.layout-content .field--name-body ol,
.layout-content .field--name-body p{
position:relative;
opacity:0;
bottom:-100px;
}

.field--name-field-text-right  h2.activee,
.field--name-field-text-right h3.activee,
.field--name-field-text-right hr.activee,
.field--name-field-text-right ul.activee,
.field--name-field-text-right ol.activee,
.field--name-field-text-right p.activee,

#block-drualas-theme-contactus h2.activee,
#block-drualas-theme-contactus p.activee,
.view-header h2.activee,
.node-teaser-projekt.activee,
.paragraph-item-content-link2.activee,
.field--name-field-body h2.activee,
.field--name-field-body h3.activee,
.field--name-field-body hr.activee,
.field--name-field-body ul.activee,
.field--name-field-body ol.activee,
.field--name-field-body p.activee,
.layout-content .field--name-body h2.activee,
.layout-content .field--name-body h3.activee,
.layout-content .field--name-body hr.activee,
.layout-content .field--name-body ul.activee,
.layout-content .field--name-body ol.activee,
.layout-content .field--name-body p.activee  {
animation: moveBottom 1000ms 1 ease,  moveOpacity 500ms 1 ease;
opacity:1;
bottom:0;
}