
#animation_thomas_pets > div#pazl1{
  position:relative;
  width:90vw;
  height:48vw; 
  border: 0px solid #c2cad3;
  border-style: dashed;
  overflow:hidden;
  max-width: 1420px;
  max-height: 740px; 
}


/* actor1 background */
#animation_thomas_pets > div#pazl1 > div.actor1{
position:absolute; 
width: 100%;
opacity:0.001;
transition: all 0.75s ease-out 0s;/**/
}
#animation_thomas_pets > div#pazl1._active > div.actor1,
#animation_thomas_pets > div#pazl1.activ > div.actor1
{
opacity:0.6;
}


/* ---------------------- actor2  dog ---------------------------*/
#animation_thomas_pets > div#pazl1 > div.actor2{
position:absolute; 
top:3%; left:0%; 
border: 0px solid #eeeeee; 
width: 30%; 
z-index:20;
opacity:0.01;
transform: translate(-10%, 0%);
transition: all 0.3s ease-out 0.5s;

}
#animation_thomas_pets > div#pazl1._active > div.actor2,
#animation_thomas_pets > div#pazl1.activ > div.actor2
{
opacity:1;
transform: translate(0%, 0%);
}


/* ---------------------- actor2  cat ---------------------------*/
#animation_thomas_pets > div#pazl1 > div.actor3{
position:absolute; 
top:27%; left:0%; 
border: 0px solid #eeeeee; 
width: 55%; 
z-index:20;
opacity:0.001;
transition: all 0.9s ease-out 1.0s;
}
#animation_thomas_pets > div#pazl1._active > div.actor3,
#animation_thomas_pets > div#pazl1.activ > div.actor3
{
opacity:1;
}








/* ----------img1---------- */
#animation_thomas_pets > div#pazl1 > div.actor10{
position:absolute; top:1%; left:52%; width: 22%; z-index:80;
opacity: 0.001;
transform: translate(-10%, 0%) scale(0.01);
transition: all 0.6s ease 1.3s;
}
#animation_thomas_pets > div#pazl1._active > div.actor10{
opacity: 1;
transform: translate(0%, 0%) scale(1.0);
}


/* ----------img2---------- */
#animation_thomas_pets > div#pazl1 > div.actor20{
position:absolute; top:36%; left:52%; width: 22%; z-index:75;
opacity: 0.001;
transform: translate(-10%, 0%) scale(0.01);
transition: all 0.6s ease 1.5s;
}
#animation_thomas_pets > div#pazl1._active > div.actor20{
opacity: 1;
transform: translate(0%, 0%) scale(1.0);
}


/* ----------img3---------- */
#animation_thomas_pets > div#pazl1 > div.actor30{
position:absolute; top:70%;  left:52%; width: 22%; z-index:70;
opacity: 0.001;
transform: translate(-10%, 0%) scale(0.01);
transition: all 0.6s ease 1.7s;
}
#animation_thomas_pets > div#pazl1._active > div.actor30{
opacity: 1;
transform: translate(0%, 0%) scale(1.0);
}

/* ----------img4---------- */
#animation_thomas_pets > div#pazl1 > div.actor40{
position:absolute; top:36%;  left:77%; width: 22%; z-index:70;
opacity: 0.001;
transform: translate(-10%, 0%) scale(0.01);
transition: all 0.6s ease 1.7s;
}
#animation_thomas_pets > div#pazl1._active > div.actor40{
opacity: 1;
transform: translate(0%, 0%) scale(1.0);
}

/* ----------img5---------- */
#animation_thomas_pets > div#pazl1 > div.actor50{
position:absolute; top:1%;  left:77%; width: 22%; z-index:70;
opacity: 0.001;
transform: translate(-10%, 0%) scale(0.01);
transition: all 0.6s ease 1.5s;
}
#animation_thomas_pets > div#pazl1._active > div.actor50{
opacity: 1;
transform: translate(0%, 0%) scale(1.0);
}

/* ----------img6---------- */
#animation_thomas_pets > div#pazl1 > div.actor60{
position:absolute; top:70%;  left:77%; width: 22%; z-index:70;
opacity: 0.001;
transform: translate(-10%, 0%) scale(0.01);
transition: all 0.6s ease 2.0s;
}
#animation_thomas_pets > div#pazl1._active > div.actor60{
opacity: 1;
transform: translate(0%, 0%) scale(1.0);
}

/* ----------lab---------- */
#animation_thomas_pets > div#pazl1 > div.actor70{
position:absolute; top:1%; left:27%; width: 13%; z-index:18;
opacity: 0.001;
transition: all 0.9s ease 2.4s;
transform: translate(0%, 90%);
}
#animation_thomas_pets > div#pazl1._active > div.actor70{
opacity: 1;
transform: translate(1%, 1%);

}

/* ---------- thomas_pet_click ---------- */
#animation_thomas_pets > div#pazl1 > div.actor80{
position:absolute; top:67%; left:18%; z-index:75;
opacity: 0.001;
transition: all 0.6s ease 2.7s;
transform: translate(0%, 100%);
}
#animation_thomas_pets > div#pazl1._active > div.actor80{
opacity: 1;
transform: translate(0%, 0%);
}






