diff options
Diffstat (limited to 'Live2dHistoire/live2d/css/live2d.css')
| -rw-r--r-- | Live2dHistoire/live2d/css/live2d.css | 940 |
1 files changed, 940 insertions, 0 deletions
diff --git a/Live2dHistoire/live2d/css/live2d.css b/Live2dHistoire/live2d/css/live2d.css new file mode 100644 index 0000000..3ce12d2 --- /dev/null +++ b/Live2dHistoire/live2d/css/live2d.css @@ -0,0 +1,940 @@ +#landlord { + user-select: none; + position: fixed; + left: 5px; + bottom: 0; + width: 250px; + height: 280px; + z-index: 10000; + font-size: 0; + /*transition: all .3s ease-in-out;*/ + display:none; +} +#open_live2d{ + border: 2px solid rgba(75,127,199,0.9); + border-radius: 2px; + background-color: rgba(74, 59, 114,0.9); + padding:2px 10px; + color:#fff; + height:24px; + line-height:24px; + font-size:12px; + position:fixed; + right:5px; + bottom:5px; + z-index:10000; + cursor:pointer; + display:none; +} +#showInfoBtn{ + display:none; +} +#live2d { + width: 250px; + height: 280px; + position: relative; + z-index:3; +} + +.message { + opacity: 0; + color: #fff; + box-sizing: border-box; + width: 250px; + height: auto; + margin: auto; + padding: 7px; + bottom: 280px; + left: 0px; + text-align: center; + border: 2px solid rgba(75,127,199,0.9); + border-radius: 5px; + background-color: rgba(74, 59, 114,0.9); + font-size: 13px; + font-weight: 400; + text-overflow: ellipsis; + text-transform: uppercase; + overflow: hidden; + position: absolute; + /*animation-delay: 5s; + animation-duration: 50s; + animation-iteration-count: infinite; + animation-name: shake; + animation-timing-function: ease-in-out;*/ +} +.live_talk_input_body{ + position:absolute; + bottom:15px; + left:0; + width:250px; + display:none; + z-index:4; +} +.live_talk_input_text_body{ + width:250px; + box-sizing:border-box; + height:28px; + border: 2px solid rgb(223, 179, 241); + border-radius: 5px; + background-color: rgba(74, 59, 114,0.9); +} +.live_talk_input_name_body{ + width:70px; + box-sizing:border-box; + height:24px; + border: 2px solid rgb(223, 179, 241); + border-radius: 5px; + background-color: rgba(74, 59, 114,0.9); + margin-bottom:3px; +} +.live_talk_name{ + background-color:transparent; + border:0px; + margin:0; + width:66px; + height:20px; + line-height:20px; + text-align:center; + font-size:12px; + color:#fff; + outline:none; + box-sizing:border-box; + padding:0 3px; +} +.live_talk_talk{ + background-color:transparent; + border:0px; + margin:0; + width:206px; + height:24px; + line-height:24px; + text-align:left; + font-size:12px; + color:#fff; + outline:none; + box-sizing:border-box; + padding:0 3px; + float:left; +} +.live_talk_send_btn{ + background-color:transparent; + color:#fff; + border:0px; + cursor:pointer; + padding:0 4px; + border-left:1px solid #fff; + font-size:12px; + float:right; + height:18px; + line-height:18px; + outline:none; + margin:3px 0 0 0; +} +.white_input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ + color: #E4E4E4; + opacity: 1; +} + +.white_input::-moz-placeholder { /* Mozilla Firefox 19+*/ + color: #E4E4E4; + opacity: 1; +} + +.white_input:-ms-input-placeholder { + color: #E4E4E4; +} + +.white_input::-webkit-input-placeholder { + color: #E4E4E4; +} + + +.hide-button { + position: absolute; + top: 10px; + right: 0; + /* bottom: 30px; */ + display: none; + overflow: hidden; + /* padding: 4px; */ + width: 60px; + height: 20px; + border: 1px solid rgba(255,137,255,.4); + border-radius: 12px; + background: rgba(255,137,255,.2); + box-shadow: 0 3px 15px 2px rgba(255,137,255,.4); + text-align: center; + font-size: 12px; + cursor: pointer; +} + +.hide-button:hover { + border: 1px solid #f4a7b9; + background: #f4f6f8; +} +.live_ico_box{ + width:15px; + position:absolute; + z-index:5; + right:0; + top:10px; + opacity:0.9; +} +.live_ico_item{ + width:15px; + height: 20px; + cursor:pointer; + background-position:center center; + background-repeat:no-repeat; + background-size:15px; +} +.live_ico_item.type_talk{ + background-image:url(../images/talk.png); +} +.live_ico_item.type_quit{ + background-image:url(../images/quite.png); +} +.live_ico_item.type_info{ + background-image:url(../images/info.png); +} +.live_ico_item.type_music{ + background-image:url(../images/music.png); +} +.live_ico_item.type_youdu{ + background-image:url(../images/youdu.png); +} +.live_ico_item.type_music.play{ + background-image:url(../images/pasue.png); +} +.live_ico_item.type_youdu.doudong{ + -webkit-animation-name: shake-little; + -ms-animation-name: shake-little; + animation-name: shake-little; + -webkit-animation-duration: 100ms; + -ms-animation-duration: 100ms; + animation-duration: 100ms; + -webkit-animation-iteration-count: infinite; + -ms-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-timing-function: ease-in-out; + -ms-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-delay: 0s; + -ms-animation-delay: 0s; + animation-delay: 0s; + -webkit-animation-play-state: running; + -ms-animation-play-state: running; + animation-play-state: running +} +.douqilai,.douqilai *{ + animation: shake-it .5s reverse infinite cubic-bezier(0.68, -0.55, 0.27, 1.55); +} +.l2d_caihong{ + animation: rainbow 1.5s infinite; +} +@media (max-width: 860px) { + #landlord { + display: none!important; + } +} + +@keyframes shake { + 2% { + transform: translate(0.5px, -1.5px) rotate(-0.5deg); + } + + 4% { + transform: translate(0.5px, 1.5px) rotate(1.5deg); + } + + 6% { + transform: translate(1.5px, 1.5px) rotate(1.5deg); + } + + 8% { + transform: translate(2.5px, 1.5px) rotate(0.5deg); + } + + 10% { + transform: translate(0.5px, 2.5px) rotate(0.5deg); + } + + 12% { + transform: translate(1.5px, 1.5px) rotate(0.5deg); + } + + 14% { + transform: translate(0.5px, 0.5px) rotate(0.5deg); + } + + 16% { + transform: translate(-1.5px, -0.5px) rotate(1.5deg); + } + + 18% { + transform: translate(0.5px, 0.5px) rotate(1.5deg); + } + + 20% { + transform: translate(2.5px, 2.5px) rotate(1.5deg); + } + + 22% { + transform: translate(0.5px, -1.5px) rotate(1.5deg); + } + + 24% { + transform: translate(-1.5px, 1.5px) rotate(-0.5deg); + } + + 26% { + transform: translate(1.5px, 0.5px) rotate(1.5deg); + } + + 28% { + transform: translate(-0.5px, -0.5px) rotate(-0.5deg); + } + + 30% { + transform: translate(1.5px, -0.5px) rotate(-0.5deg); + } + + 32% { + transform: translate(2.5px, -1.5px) rotate(1.5deg); + } + + 34% { + transform: translate(2.5px, 2.5px) rotate(-0.5deg); + } + + 36% { + transform: translate(0.5px, -1.5px) rotate(0.5deg); + } + + 38% { + transform: translate(2.5px, -0.5px) rotate(-0.5deg); + } + + 40% { + transform: translate(-0.5px, 2.5px) rotate(0.5deg); + } + + 42% { + transform: translate(-1.5px, 2.5px) rotate(0.5deg); + } + + 44% { + transform: translate(-1.5px, 1.5px) rotate(0.5deg); + } + + 46% { + transform: translate(1.5px, -0.5px) rotate(-0.5deg); + } + + 48% { + transform: translate(2.5px, -0.5px) rotate(0.5deg); + } + + 50% { + transform: translate(-1.5px, 1.5px) rotate(0.5deg); + } + + 52% { + transform: translate(-0.5px, 1.5px) rotate(0.5deg); + } + + 54% { + transform: translate(-1.5px, 1.5px) rotate(0.5deg); + } + + 56% { + transform: translate(0.5px, 2.5px) rotate(1.5deg); + } + + 58% { + transform: translate(2.5px, 2.5px) rotate(0.5deg); + } + + 60% { + transform: translate(2.5px, -1.5px) rotate(1.5deg); + } + + 62% { + transform: translate(-1.5px, 0.5px) rotate(1.5deg); + } + + 64% { + transform: translate(-1.5px, 1.5px) rotate(1.5deg); + } + + 66% { + transform: translate(0.5px, 2.5px) rotate(1.5deg); + } + + 68% { + transform: translate(2.5px, -1.5px) rotate(1.5deg); + } + + 70% { + transform: translate(2.5px, 2.5px) rotate(0.5deg); + } + + 72% { + transform: translate(-0.5px, -1.5px) rotate(1.5deg); + } + + 74% { + transform: translate(-1.5px, 2.5px) rotate(1.5deg); + } + + 76% { + transform: translate(-1.5px, 2.5px) rotate(1.5deg); + } + + 78% { + transform: translate(-1.5px, 2.5px) rotate(0.5deg); + } + + 80% { + transform: translate(-1.5px, 0.5px) rotate(-0.5deg); + } + + 82% { + transform: translate(-1.5px, 0.5px) rotate(-0.5deg); + } + + 84% { + transform: translate(-0.5px, 0.5px) rotate(1.5deg); + } + + 86% { + transform: translate(2.5px, 1.5px) rotate(0.5deg); + } + + 88% { + transform: translate(-1.5px, 0.5px) rotate(1.5deg); + } + + 90% { + transform: translate(-1.5px, -0.5px) rotate(-0.5deg); + } + + 92% { + transform: translate(-1.5px, -1.5px) rotate(1.5deg); + } + + 94% { + transform: translate(0.5px, 0.5px) rotate(-0.5deg); + } + + 96% { + transform: translate(2.5px, -0.5px) rotate(-0.5deg); + } + + 98% { + transform: translate(-1.5px, -1.5px) rotate(-0.5deg); + } + + 0%, 100% { + transform: translate(0, 0) rotate(0); + } +} + +@keyframes quan { + 0% { transform:rotate(0); + animation-timing-function:linear; } + 100% { transform:rotate(360deg); } +} +@-webkit-keyframes quan { + 0% { -webkit-transform:rotate(0); + -webkit-animation-timing-function:linear; } + 100% { -webkit-transform:rotate(360deg); } +} +@-moz-keyframes quan { + 0% { -moz-transform:rotate(0); + -moz-animation-timing-function:linear; } + 100% { -moz-transform:rotate(360deg); } +} +@-o-keyframes quan { + 0% { -o-transform:rotate(0); + -o-animation-timing-function:linear; } + 100% { -o-transform:rotate(360deg); } +} +@-ms-keyframes quan { + 0% { -ms-transform:rotate(0); + -ms-animation-timing-function:linear; } + 100% { -ms-transform:rotate(360deg); } +} +@-webkit-keyframes shake-little { + 0% { + -webkit-transform: translate(0px, 0px) rotate(0deg) + } + 2% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 4% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 6% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 8% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 10% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 12% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 14% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 16% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 18% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 20% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 22% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 24% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 26% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 28% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 30% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 32% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 34% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 36% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 38% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 40% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 42% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 44% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 46% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 48% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 50% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 52% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 54% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 56% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 58% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 60% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 62% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 64% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 66% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 68% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 70% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 72% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 74% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 76% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 78% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 80% { + -webkit-transform: translate(0px, -1px) rotate(-0.5deg) + } + 82% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 84% { + -webkit-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 86% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 88% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 90% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 92% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 94% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } + 96% { + -webkit-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 98% { + -webkit-transform: translate(0px, 0px) rotate(-0.5deg) + } +} +@-ms-keyframes shake-little { + 0% { + -ms-transform: translate(0px, 0px) rotate(0deg) + } + 2% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 4% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 6% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 8% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 10% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 12% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 14% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 16% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 18% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 20% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 22% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 24% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 26% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 28% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 30% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 32% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 34% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 36% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 38% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 40% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 42% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 44% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 46% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 48% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 50% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 52% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 54% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 56% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 58% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 60% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 62% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 64% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 66% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 68% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 70% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 72% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 74% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 76% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 78% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 80% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 82% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 84% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 86% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 88% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 90% { + -ms-transform: translate(-1px, -1px) rotate(-0.5deg) + } + 92% { + -ms-transform: translate(0px, 0px) rotate(-0.5deg) + } + 94% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } + 96% { + -ms-transform: translate(-1px, 0px) rotate(-0.5deg) + } + 98% { + -ms-transform: translate(0px, -1px) rotate(-0.5deg) + } +} +@keyframes shake-little { + 0% { + transform: translate(0px, 0px) rotate(0deg) + } + 2% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 4% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 6% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 8% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 10% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 12% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 14% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 16% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 18% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 20% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 22% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 24% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 26% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 28% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 30% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 32% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 34% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 36% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 38% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 40% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 42% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 44% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 46% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 48% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 50% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 52% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 54% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 56% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 58% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 60% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 62% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 64% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 66% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 68% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 70% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 72% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 74% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 76% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 78% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 80% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 82% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 84% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 86% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 88% { + transform: translate(0px, 0px) rotate(-0.5deg) + } + 90% { + transform: translate(-1px, -1px) rotate(-0.5deg) + } + 92% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 94% { + transform: translate(-1px, 0px) rotate(-0.5deg) + } + 96% { + transform: translate(0px, -1px) rotate(-0.5deg) + } + 98% { + transform: translate(0px, -1px) rotate(-0.5deg) + } +} +@keyframes shake-it{ + 0%{ + text-shadow: 0 0 rgba(0, 255, 255, .5), 0 0 rgba(255, 0, 0, .5); + } + 25%{ + text-shadow: -2px 0 rgba(0, 255, 255, .5), 2px 0 rgba(255, 0, 0, .5); + } + 50%{ + text-shadow: -5px 0 rgba(0, 255, 255, .5), 3px 0 rgba(255, 0, 0, .5); + } + 100%{ + text-shadow: 3px 0 rgba(0, 255, 255, .5), 5px 0 rgba(255, 0, 0, .5); + } +} +@keyframes rainbow { + 100% { filter: hue-rotate(360deg); } +} \ No newline at end of file |