.wlwl-congratulations-effect-firework {
position: relative;
z-index: 1;
}
.wlwl-congratulations-effect-firework > .wlwl-congratulations-effect-before,
.wlwl-congratulations-effect-firework > .wlwl-congratulations-effect-after {
position: absolute;
width: 5px;
height: 5px;
border-radius: 50%;
box-shadow: 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff, 0 0 #fff;
-moz-animation: 1s wlwl_bang ease-out infinite backwards, 1s wlwl_gravity ease-in infinite backwards, 5s position linear infinite backwards;
-webkit-animation: 1s wlwl_bang ease-out infinite backwards, 1s wlwl_gravity ease-in infinite backwards, 5s position linear infinite backwards;
-o-animation: 1s wlwl_bang ease-out infinite backwards, 1s wlwl_gravity ease-in infinite backwards, 5s position linear infinite backwards;
-ms-animation: 1s wlwl_bang ease-out infinite backwards, 1s wlwl_gravity ease-in infinite backwards, 5s position linear infinite backwards;
animation: 1s wlwl_bang ease-out infinite backwards, 1s wlwl_gravity ease-in infinite backwards, 5s position linear infinite backwards;
}
.wlwl-congratulations-effect-firework > .after {
-moz-animation-delay: 1.25s, 1.25s, 1.25s;
-webkit-animation-delay: 1.25s, 1.25s, 1.25s;
-o-animation-delay: 1.25s, 1.25s, 1.25s;
-ms-animation-delay: 1.25s, 1.25s, 1.25s;
animation-delay: 1.25s, 1.25s, 1.25s;
-moz-animation-duration: 1.25s, 1.25s, 6.25s;
-webkit-animation-duration: 1.25s, 1.25s, 6.25s;
-o-animation-duration: 1.25s, 1.25s, 6.25s;
-ms-animation-duration: 1.25s, 1.25s, 6.25s;
animation-duration: 1.25s, 1.25s, 6.25s;
}
@-webkit-keyframes wlwl_bang {
to {
box-shadow: 43px -119.6666666667px #a200ff, -245px -267.6666666667px #ff0048, -23px -251.6666666667px #4400ff, 104px -269.6666666667px #d000ff, -12px -3.6666666667px darkorange, 160px -130.6666666667px #004dff, 55px -347.6666666667px #0dff00, 238px -7.6666666667px #ff0055, 170px -135.6666666667px #c8ff00, -117px -239.6666666667px #7b00ff, -19px -146.6666666667px #c4ff00, -51px -409.6666666667px #0011ff, -175px -40.6666666667px #0073ff, -181px -340.6666666667px #26ff00, -213px -208.6666666667px #73ff00, 231px -343.6666666667px #ff1100, 30px -103.6666666667px #ff9900, -183px -233.6666666667px #ff00a2, 237px -22.6666666667px #ff00b3, -68px -96.6666666667px #ee00ff, 201px -185.6666666667px #ae00ff, 247px -65.6666666667px #0900ff, -163px -343.6666666667px #ffae00, 235px 73.3333333333px #00ffd5, 10px -84.6666666667px #ff2b00, 92px -80.6666666667px #aeff00, 39px -327.6666666667px #ff00e1, 61px -360.6666666667px #00ff7b, -222px -97.6666666667px #00ff11, -168px -230.6666666667px #ff2b00, -213px 70.3333333333px #00a6ff, -155px -214.6666666667px #b700ff, -231px 2.3333333333px #2b00ff, -201px -326.6666666667px #f200ff, 176px -55.6666666667px #ff007b, 161px -259.6666666667px #e600ff, -193px -369.6666666667px #4400ff, 139px -265.6666666667px #48ff00, -221px -29.6666666667px #ff00b7, -192px -263.6666666667px #ff006a, -134px -16.6666666667px #ff8800, -156px -320.6666666667px #006aff, 36px -165.6666666667px #0026ff, -42px -117.6666666667px #dd00ff, -24px -382.6666666667px #00ff2f, 221px -322.6666666667px #0dff00, 83px -181.6666666667px #006fff, 81px -286.6666666667px #1500ff, -225px -115.6666666667px #5500ff, 119px -138.6666666667px #ffaa00, 199px -311.6666666667px #00ddff;
}
}
@-moz-keyframes wlwl_bang {
to {
box-shadow: 43px -119.6666666667px #a200ff, -245px -267.6666666667px #ff0048, -23px -251.6666666667px #4400ff, 104px -269.6666666667px #d000ff, -12px -3.6666666667px darkorange, 160px -130.6666666667px #004dff, 55px -347.6666666667px #0dff00, 238px -7.6666666667px #ff0055, 170px -135.6666666667px #c8ff00, -117px -239.6666666667px #7b00ff, -19px -146.6666666667px #c4ff00, -51px -409.6666666667px #0011ff, -175px -40.6666666667px #0073ff, -181px -340.6666666667px #26ff00, -213px -208.6666666667px #73ff00, 231px -343.6666666667px #ff1100, 30px -103.6666666667px #ff9900, -183px -233.6666666667px #ff00a2, 237px -22.6666666667px #ff00b3, -68px -96.6666666667px #ee00ff, 201px -185.6666666667px #ae00ff, 247px -65.6666666667px #0900ff, -163px -343.6666666667px #ffae00, 235px 73.3333333333px #00ffd5, 10px -84.6666666667px #ff2b00, 92px -80.6666666667px #aeff00, 39px -327.6666666667px #ff00e1, 61px -360.6666666667px #00ff7b, -222px -97.6666666667px #00ff11, -168px -230.6666666667px #ff2b00, -213px 70.3333333333px #00a6ff, -155px -214.6666666667px #b700ff, -231px 2.3333333333px #2b00ff, -201px -326.6666666667px #f200ff, 176px -55.6666666667px #ff007b, 161px -259.6666666667px #e600ff, -193px -369.6666666667px #4400ff, 139px -265.6666666667px #48ff00, -221px -29.6666666667px #ff00b7, -192px -263.6666666667px #ff006a, -134px -16.6666666667px #ff8800, -156px -320.6666666667px #006aff, 36px -165.6666666667px #0026ff, -42px -117.6666666667px #dd00ff, -24px -382.6666666667px #00ff2f, 221px -322.6666666667px #0dff00, 83px -181.6666666667px #006fff, 81px -286.6666666667px #1500ff, -225px -115.6666666667px #5500ff, 119px -138.6666666667px #ffaa00, 199px -311.6666666667px #00ddff;
}
}
@-o-keyframes wlwl_bang {
to {
box-shadow: 43px -119.6666666667px #a200ff, -245px -267.6666666667px #ff0048, -23px -251.6666666667px #4400ff, 104px -269.6666666667px #d000ff, -12px -3.6666666667px darkorange, 160px -130.6666666667px #004dff, 55px -347.6666666667px #0dff00, 238px -7.6666666667px #ff0055, 170px -135.6666666667px #c8ff00, -117px -239.6666666667px #7b00ff, -19px -146.6666666667px #c4ff00, -51px -409.6666666667px #0011ff, -175px -40.6666666667px #0073ff, -181px -340.6666666667px #26ff00, -213px -208.6666666667px #73ff00, 231px -343.6666666667px #ff1100, 30px -103.6666666667px #ff9900, -183px -233.6666666667px #ff00a2, 237px -22.6666666667px #ff00b3, -68px -96.6666666667px #ee00ff, 201px -185.6666666667px #ae00ff, 247px -65.6666666667px #0900ff, -163px -343.6666666667px #ffae00, 235px 73.3333333333px #00ffd5, 10px -84.6666666667px #ff2b00, 92px -80.6666666667px #aeff00, 39px -327.6666666667px #ff00e1, 61px -360.6666666667px #00ff7b, -222px -97.6666666667px #00ff11, -168px -230.6666666667px #ff2b00, -213px 70.3333333333px #00a6ff, -155px -214.6666666667px #b700ff, -231px 2.3333333333px #2b00ff, -201px -326.6666666667px #f200ff, 176px -55.6666666667px #ff007b, 161px -259.6666666667px #e600ff, -193px -369.6666666667px #4400ff, 139px -265.6666666667px #48ff00, -221px -29.6666666667px #ff00b7, -192px -263.6666666667px #ff006a, -134px -16.6666666667px #ff8800, -156px -320.6666666667px #006aff, 36px -165.6666666667px #0026ff, -42px -117.6666666667px #dd00ff, -24px -382.6666666667px #00ff2f, 221px -322.6666666667px #0dff00, 83px -181.6666666667px #006fff, 81px -286.6666666667px #1500ff, -225px -115.6666666667px #5500ff, 119px -138.6666666667px #ffaa00, 199px -311.6666666667px #00ddff;
}
}
@-ms-keyframes wlwl_bang {
to {
box-shadow: 43px -119.6666666667px #a200ff, -245px -267.6666666667px #ff0048, -23px -251.6666666667px #4400ff, 104px -269.6666666667px #d000ff, -12px -3.6666666667px darkorange, 160px -130.6666666667px #004dff, 55px -347.6666666667px #0dff00, 238px -7.6666666667px #ff0055, 170px -135.6666666667px #c8ff00, -117px -239.6666666667px #7b00ff, -19px -146.6666666667px #c4ff00, -51px -409.6666666667px #0011ff, -175px -40.6666666667px #0073ff, -181px -340.6666666667px #26ff00, -213px -208.6666666667px #73ff00, 231px -343.6666666667px #ff1100, 30px -103.6666666667px #ff9900, -183px -233.6666666667px #ff00a2, 237px -22.6666666667px #ff00b3, -68px -96.6666666667px #ee00ff, 201px -185.6666666667px #ae00ff, 247px -65.6666666667px #0900ff, -163px -343.6666666667px #ffae00, 235px 73.3333333333px #00ffd5, 10px -84.6666666667px #ff2b00, 92px -80.6666666667px #aeff00, 39px -327.6666666667px #ff00e1, 61px -360.6666666667px #00ff7b, -222px -97.6666666667px #00ff11, -168px -230.6666666667px #ff2b00, -213px 70.3333333333px #00a6ff, -155px -214.6666666667px #b700ff, -231px 2.3333333333px #2b00ff, -201px -326.6666666667px #f200ff, 176px -55.6666666667px #ff007b, 161px -259.6666666667px #e600ff, -193px -369.6666666667px #4400ff, 139px -265.6666666667px #48ff00, -221px -29.6666666667px #ff00b7, -192px -263.6666666667px #ff006a, -134px -16.6666666667px #ff8800, -156px -320.6666666667px #006aff, 36px -165.6666666667px #0026ff, -42px -117.6666666667px #dd00ff, -24px -382.6666666667px #00ff2f, 221px -322.6666666667px #0dff00, 83px -181.6666666667px #006fff, 81px -286.6666666667px #1500ff, -225px -115.6666666667px #5500ff, 119px -138.6666666667px #ffaa00, 199px -311.6666666667px #00ddff;
}
}
@keyframes wlwl_bang {
to {
box-shadow: 43px -119.6666666667px #a200ff, -245px -267.6666666667px #ff0048, -23px -251.6666666667px #4400ff, 104px -269.6666666667px #d000ff, -12px -3.6666666667px darkorange, 160px -130.6666666667px #004dff, 55px -347.6666666667px #0dff00, 238px -7.6666666667px #ff0055, 170px -135.6666666667px #c8ff00, -117px -239.6666666667px #7b00ff, -19px -146.6666666667px #c4ff00, -51px -409.6666666667px #0011ff, -175px -40.6666666667px #0073ff, -181px -340.6666666667px #26ff00, -213px -208.6666666667px #73ff00, 231px -343.6666666667px #ff1100, 30px -103.6666666667px #ff9900, -183px -233.6666666667px #ff00a2, 237px -22.6666666667px #ff00b3, -68px -96.6666666667px #ee00ff, 201px -185.6666666667px #ae00ff, 247px -65.6666666667px #0900ff, -163px -343.6666666667px #ffae00, 235px 73.3333333333px #00ffd5, 10px -84.6666666667px #ff2b00, 92px -80.6666666667px #aeff00, 39px -327.6666666667px #ff00e1, 61px -360.6666666667px #00ff7b, -222px -97.6666666667px #00ff11, -168px -230.6666666667px #ff2b00, -213px 70.3333333333px #00a6ff, -155px -214.6666666667px #b700ff, -231px 2.3333333333px #2b00ff, -201px -326.6666666667px #f200ff, 176px -55.6666666667px #ff007b, 161px -259.6666666667px #e600ff, -193px -369.6666666667px #4400ff, 139px -265.6666666667px #48ff00, -221px -29.6666666667px #ff00b7, -192px -263.6666666667px #ff006a, -134px -16.6666666667px #ff8800, -156px -320.6666666667px #006aff, 36px -165.6666666667px #0026ff, -42px -117.6666666667px #dd00ff, -24px -382.6666666667px #00ff2f, 221px -322.6666666667px #0dff00, 83px -181.6666666667px #006fff, 81px -286.6666666667px #1500ff, -225px -115.6666666667px #5500ff, 119px -138.6666666667px #ffaa00, 199px -311.6666666667px #00ddff;
}
}
@-webkit-keyframes wlwl_gravity {
to {
transform: translateY(200px);
-moz-transform: translateY(200px);
-webkit-transform: translateY(200px);
-o-transform: translateY(200px);
-ms-transform: translateY(200px);
opacity: 0;
}
}
@-moz-keyframes wlwl_gravity {
to {
transform: translateY(200px);
-moz-transform: translateY(200px);
-webkit-transform: translateY(200px);
-o-transform: translateY(200px);
-ms-transform: translateY(200px);
opacity: 0;
}
}
@-o-keyframes wlwl_gravity {
to {
transform: translateY(200px);
-moz-transform: translateY(200px);
-webkit-transform: translateY(200px);
-o-transform: translateY(200px);
-ms-transform: translateY(200px);
opacity: 0;
}
}
@-ms-keyframes wlwl_gravity {
to {
transform: translateY(200px);
-moz-transform: translateY(200px);
-webkit-transform: translateY(200px);
-o-transform: translateY(200px);
-ms-transform: translateY(200px);
opacity: 0;
}
}
@keyframes wlwl_gravity {
to {
transform: translateY(200px);
-moz-transform: translateY(200px);
-webkit-transform: translateY(200px);
-o-transform: translateY(200px);
-ms-transform: translateY(200px);
opacity: 0;
}
}
@-webkit-keyframes position {
0%,
19.9% {
margin-top: 10%;
margin-left: 40%;
}
20%,
39.9% {
margin-top: 40%;
margin-left: 30%;
}
40%,
59.9% {
margin-top: 20%;
margin-left: 70%;
}
60%,
79.9% {
margin-top: 30%;
margin-left: 20%;
}
80%,
99.9% {
margin-top: 30%;
margin-left: 80%;
}
}
@-moz-keyframes position {
0%,
19.9% {
margin-top: 10%;
margin-left: 40%;
}
20%,
39.9% {
margin-top: 40%;
margin-left: 30%;
}
40%,
59.9% {
margin-top: 20%;
margin-left: 70%;
}
60%,
79.9% {
margin-top: 30%;
margin-left: 20%;
}
80%,
99.9% {
margin-top: 30%;
margin-left: 80%;
}
}
@-o-keyframes position {
0%,
19.9% {
margin-top: 10%;
margin-left: 40%;
}
20%,
39.9% {
margin-top: 40%;
margin-left: 30%;
}
40%,
59.9% {
margin-top: 20%;
margin-left: 70%;
}
60%,
79.9% {
margin-top: 30%;
margin-left: 20%;
}
80%,
99.9% {
margin-top: 30%;
margin-left: 80%;
}
}
@-ms-keyframes position {
0%,
19.9% {
margin-top: 10%;
margin-left: 40%;
}
20%,
39.9% {
margin-top: 40%;
margin-left: 30%;
}
40%,
59.9% {
margin-top: 20%;
margin-left: 70%;
}
60%,
79.9% {
margin-top: 30%;
margin-left: 20%;
}
80%,
99.9% {
margin-top: 30%;
margin-left: 80%;
}
}
@keyframes position {
0%,
19.9% {
margin-top: 10%;
margin-left: 40%;
}
20%,
39.9% {
margin-top: 40%;
margin-left: 30%;
}
40%,
59.9% {
margin-top: 20%;
margin-left: 70%;
}
60%,
79.9% {
margin-top: 30%;
margin-left: 20%;
}
80%,
99.9% {
margin-top: 30%;
margin-left: 80%;
}
}