.il-cctv .marco-grande,.il-cctv .toma-grande,.il-cctv .division,.il-cctv .toma-sola{opacity:0}.il-cctv .division{stroke-dasharray:1 1}.il-cctv .torre,.il-cctv .pasante,.il-cctv .persona{transform-box:fill-box}html[data-anim] .il-cctv:not([data-visto]) .monitor{transform:translate(var(--dx), var(--dy))}html[data-anim] .il-cctv:not([data-visto]) .marco-grande,html[data-anim] .il-cctv:not([data-visto]) .toma-grande,html[data-anim] .il-cctv:not([data-visto]) .toma-sola{opacity:1}html[data-anim] .il-cctv:not([data-visto]) .bisel,html[data-anim] .il-cctv:not([data-visto]) .mosaico,html[data-anim] .il-cctv:not([data-visto]) .brazo,html[data-anim] .il-cctv:not([data-visto]) .torre,html[data-anim] .il-cctv:not([data-visto]) .rec,html[data-anim] .il-cctv:not([data-visto]) .grabando{opacity:0}html[data-anim] .il-cctv[data-visto] .toma-grande{animation:.6s ease-out 1.9s both cctv-sale}html[data-anim] .il-cctv[data-visto] .division{animation:1.6s cubic-bezier(.45,0,.2,1) .7s both cctv-divide}@keyframes cctv-divide{0%{opacity:1;stroke-dashoffset:1px}45%{opacity:1;stroke-dashoffset:0}70%{opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:0}}@keyframes cctv-sale{0%{opacity:1}to{opacity:0}}@keyframes cctv-entra{0%{opacity:0}}html[data-anim] .il-cctv[data-visto] .monitor{animation:cctv-separa 1s var(--ease-resorte) both;animation-delay:calc(3.2s + var(--i) * 90ms)}@keyframes cctv-separa{0%{transform:translate(var(--dx), var(--dy))}to{transform:none}}html[data-anim] .il-cctv[data-visto] .marco-grande{animation:.35s ease-out 3.2s both cctv-sale}html[data-anim] .il-cctv[data-visto] .bisel{animation:.35s ease-out 3.2s both cctv-entra}html[data-anim] .il-cctv[data-visto] .brazo{animation:.6s ease-out 3.6s both cctv-entra}html[data-anim] .il-cctv[data-visto] .mosaico{animation:.5s ease-out both cctv-entra;animation-delay:calc(6.1s + var(--i) * .16s)}html[data-anim] .il-cctv[data-visto] .toma-sola{animation:.5s ease-out both cctv-sale;animation-delay:calc(6.1s + var(--i) * .16s)}html[data-anim] .il-cctv[data-visto] .torre{animation:cctv-torre .8s var(--ease-salida) 3.8s both}@keyframes cctv-torre{0%{opacity:0;transform:translate(14px)}}html[data-anim] .il-cctv[data-visto] .grabando{animation:.5s ease-out 6.7s both cctv-entra}html[data-anim] .il-cctv[data-visto] .rec,html[data-anim] .il-cctv[data-visto] .punto{animation:.4s ease-out 6.7s both cctv-entra,1.8s ease-in-out 7.1s infinite cctv-rec}@keyframes cctv-rec{0%,to{opacity:1}50%{opacity:.25}}html[data-anim] .il-cctv[data-visto] .persona{animation:6s ease-in-out .5s infinite alternate both cctv-camina}@keyframes cctv-camina{0%{transform:translate(-8px)}to{transform:translate(36px)}}.il-cctv .pasante,.il-cctv .barrido{opacity:0}html[data-anim] .il-cctv[data-visto] .pasante{animation:cctv-pasa var(--dur) linear calc(7.8s + var(--n) * .9s) infinite}@keyframes cctv-pasa{0%{opacity:0;transform:translateX(var(--desde))}6%{opacity:.9}52%{opacity:.9;transform:translateX(var(--hasta))}53%,to{opacity:0;transform:translateX(var(--hasta))}}html[data-anim] .il-cctv[data-visto] .barrido{animation:cctv-barrido 3.2s linear calc(7.8s + var(--i) * .7s) infinite}@keyframes cctv-barrido{0%{opacity:0;transform:translateY(0)}10%,90%{opacity:.12}to{opacity:0;transform:translateY(var(--alto))}}
