/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/css-loader@2.1.1_webpack@5.88.0/node_modules/css-loader/dist/cjs.js!../../node_modules/.pnpm/postcss-loader@8.1.1_postcss@8.5.6_typescript@5.8.3_webpack@5.88.0/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-8.use[2]!../../node_modules/.pnpm/sass-loader@16.0.5_sass@1.89.2_webpack@5.88.0/node_modules/sass-loader/dist/cjs.js??clonedRuleSet-8.use[3]!./src/scss/emoticons/emoticonsv3.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*

1. monkey, flower have not been added yet
2. this file is imported into emoticons.js
 */
/** mixins used in various projects (emoticons, frontscreen, pip...)
 */
@keyframes emoticon_animation_0_25 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: 0px;
  }
  to {
    opacity: 1;
    background-position-x: -750px;
    background-position-y: 0px;
  }
}
@keyframes emoticon_animation_1_24 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -30px;
  }
  to {
    opacity: 1;
    background-position-x: -720px;
    background-position-y: -30px;
  }
}
@keyframes emoticon_animation_2_20 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -60px;
  }
  to {
    opacity: 1;
    background-position-x: -600px;
    background-position-y: -60px;
  }
}
@keyframes emoticon_animation_3_20 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -90px;
  }
  to {
    opacity: 1;
    background-position-x: -600px;
    background-position-y: -90px;
  }
}
@keyframes emoticon_animation_4_20 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -120px;
  }
  to {
    opacity: 1;
    background-position-x: -600px;
    background-position-y: -120px;
  }
}
@keyframes emoticon_animation_5_20 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -150px;
  }
  to {
    opacity: 1;
    background-position-x: -600px;
    background-position-y: -150px;
  }
}
@keyframes emoticon_animation_6_20 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -180px;
  }
  to {
    opacity: 1;
    background-position-x: -600px;
    background-position-y: -180px;
  }
}
@keyframes emoticon_animation_7_20 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -210px;
  }
  to {
    opacity: 1;
    background-position-x: -600px;
    background-position-y: -210px;
  }
}
@keyframes emoticon_animation_8_14 {
  from {
    opacity: 0.6;
    background-position-x: 0;
    background-position-y: -240px;
  }
  to {
    opacity: 1;
    background-position-x: -420px;
    background-position-y: -240px;
  }
}
@media screen {
  *[contenteditable] img.emoticon, .play-emoticons img.emoticon, .commentView .noteContents img.emoticon, img.emoticon.play {
    cursor: pointer;
    animation-delay: 0.75s;
  }
  *[contenteditable] img.emoticon[data-name=smile], .play-emoticons img.emoticon[data-name=smile], .commentView .noteContents img.emoticon[data-name=smile], img.emoticon.play[data-name=smile] {
    animation: emoticon_animation_0_25 1s steps(25) 1;
  }
  *[contenteditable] img.emoticon[data-name=thumbsup], .play-emoticons img.emoticon[data-name=thumbsup], .commentView .noteContents img.emoticon[data-name=thumbsup], img.emoticon.play[data-name=thumbsup] {
    animation: emoticon_animation_1_24 1s steps(24) 1;
  }
  *[contenteditable] img.emoticon[data-name=star1], .play-emoticons img.emoticon[data-name=star1], .commentView .noteContents img.emoticon[data-name=star1], img.emoticon.play[data-name=star1] {
    animation: emoticon_animation_2_20 1s steps(20) 1;
  }
  *[contenteditable] img.emoticon[data-name=star2], .play-emoticons img.emoticon[data-name=star2], .commentView .noteContents img.emoticon[data-name=star2], img.emoticon.play[data-name=star2] {
    animation: emoticon_animation_3_20 1s steps(20) 1;
  }
  *[contenteditable] img.emoticon[data-name=star3], .play-emoticons img.emoticon[data-name=star3], .commentView .noteContents img.emoticon[data-name=star3], img.emoticon.play[data-name=star3] {
    animation: emoticon_animation_4_20 1s steps(20) 1;
  }
  *[contenteditable] img.emoticon[data-name=star4], .play-emoticons img.emoticon[data-name=star4], .commentView .noteContents img.emoticon[data-name=star4], img.emoticon.play[data-name=star4] {
    animation: emoticon_animation_5_20 1s steps(20) 1;
  }
  *[contenteditable] img.emoticon[data-name=star5], .play-emoticons img.emoticon[data-name=star5], .commentView .noteContents img.emoticon[data-name=star5], img.emoticon.play[data-name=star5] {
    animation: emoticon_animation_6_20 1s steps(20) 1;
  }
  *[contenteditable] img.emoticon[data-name=cup], .play-emoticons img.emoticon[data-name=cup], .commentView .noteContents img.emoticon[data-name=cup], img.emoticon.play[data-name=cup] {
    animation: emoticon_animation_7_20 1s steps(20) 1;
  }
  *[contenteditable] img.emoticon[data-name=tick], .play-emoticons img.emoticon[data-name=tick], .commentView .noteContents img.emoticon[data-name=tick], img.emoticon.play[data-name=tick] {
    animation: emoticon_animation_8_14 1s steps(14) 1;
  }
  img.emoticon.play {
    animation-delay: 0s;
  }
}