/* Dónde va cada Chubi del logo sobre su fondo (web/img/logo_fondo.webp), en %. Lo escribe
   herramientas/preparar_web.py: no se toca a mano. */
.logo .chubi-1 { left: 15.472%; top: 15.943%; width: 23.255%; height: 33.921%; }
.logo .chubi-2 { left: 38.726%; top: 15.943%; width: 22.500%; height: 34.193%; }
.logo .chubi-3 { left: 61.226%; top: 16.282%; width: 23.915%; height: 32.022%; }
.chubi-publico.melocoton { --lienzo: 1.039; aspect-ratio: 412 / 374; }
.chubi-publico.melocoton .brillo { -webkit-mask-image: url(img/chubis/melocoton_brillo.png); mask-image: url(img/chubis/melocoton_brillo.png); }
.chubi-publico.melocoton.animando .brillo { -webkit-mask-image: url(img/chubis/melocoton_alegre_brillo.png); mask-image: url(img/chubis/melocoton_alegre_brillo.png); }
.chubi-publico.menta { --lienzo: 1.011; aspect-ratio: 375 / 364; }
.chubi-publico.menta .brillo { -webkit-mask-image: url(img/chubis/menta_brillo.png); mask-image: url(img/chubis/menta_brillo.png); }
.chubi-publico.menta.animando .brillo { -webkit-mask-image: url(img/chubis/menta_alegre_brillo.png); mask-image: url(img/chubis/menta_alegre_brillo.png); }
.chubi-publico.lila { --lienzo: 1.011; aspect-ratio: 313 / 364; }
.chubi-publico.lila .brillo { -webkit-mask-image: url(img/chubis/lila_brillo.png); mask-image: url(img/chubis/lila_brillo.png); }
.chubi-publico.lila.animando .brillo { -webkit-mask-image: url(img/chubis/lila_alegre_brillo.png); mask-image: url(img/chubis/lila_alegre_brillo.png); }
.chubi-publico.azul { --lienzo: 1.022; aspect-ratio: 395 / 368; }
.chubi-publico.azul .brillo { -webkit-mask-image: url(img/chubis/azul_brillo.png); mask-image: url(img/chubis/azul_brillo.png); }
.chubi-publico.azul.animando .brillo { -webkit-mask-image: url(img/chubis/azul_alegre_brillo.png); mask-image: url(img/chubis/azul_alegre_brillo.png); }
.chubi-publico.amarillo { --lienzo: 1.017; aspect-ratio: 446 / 366; }
.chubi-publico.amarillo .brillo { -webkit-mask-image: url(img/chubis/amarillo_brillo.png); mask-image: url(img/chubis/amarillo_brillo.png); }
.chubi-publico.amarillo.animando .brillo { -webkit-mask-image: url(img/chubis/amarillo_alegre_brillo.png); mask-image: url(img/chubis/amarillo_alegre_brillo.png); }
.chubi-publico.rosa { --lienzo: 1.028; aspect-ratio: 322 / 370; }
.chubi-publico.rosa .brillo { -webkit-mask-image: url(img/chubis/rosa_brillo.png); mask-image: url(img/chubis/rosa_brillo.png); }
.chubi-publico.rosa.animando .brillo { -webkit-mask-image: url(img/chubis/rosa_alegre_brillo.png); mask-image: url(img/chubis/rosa_alegre_brillo.png); }