:host,
:host *,
:host *::before,
:host *::after {
  box-sizing: border-box;
}

:host {
  display: inline-block;
}

:host {
  contain: content;
  position: relative;
  display: contents;
  width: 100%;
  height: 100%;
}

:host ::slotted(*) {
  position: absolute;
}

:host([float]) ::slotted(*:nth-of-type(3n+1)) {
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
}

:host([float]) ::slotted(*:nth-of-type(3n+2)) {
  animation-direction: reverse;
}

:host([float]) ::slotted(*:nth-of-type(3n+3)) {
  animation-direction: alternate-reverse;
}

:host([float]) ::slotted(*:nth-of-type(5n+1)) {
  -webkit-animation: floating-x 10s infinite;
          animation: floating-x 10s infinite;
}

:host([float]) ::slotted(*:nth-of-type(5n+2)) {
  -webkit-animation: floating-x-spin 15s infinite;
          animation: floating-x-spin 15s infinite;
}

:host([float]) ::slotted(*:nth-of-type(5n+3)) {
  -webkit-animation: floating-x-full-spin 35s infinite;
          animation: floating-x-full-spin 35s infinite;
}

:host([float]) ::slotted(*:nth-of-type(5n+4)) {
  -webkit-animation: floating-x-full-spin-rel 20s infinite;
          animation: floating-x-full-spin-rel 20s infinite;
}

:host([float]) ::slotted(*:nth-of-type(5n+5)) {
  -webkit-animation: floating-x-full-spin 25s infinite;
          animation: floating-x-full-spin 25s infinite;
}
