{"id":1717,"date":"2018-03-04T01:13:56","date_gmt":"2018-03-04T01:13:56","guid":{"rendered":"http:\/\/thingography.com\/?p=1717"},"modified":"2025-02-13T20:59:38","modified_gmt":"2025-02-13T20:59:38","slug":"css-slot-machine-2","status":"publish","type":"post","link":"https:\/\/thingography.com\/css-slot-machine-2\/","title":{"rendered":"Slot Machine-2 CSS Animation"},"content":{"rendered":"<style>\n.ani-box {width: 100%; height: 650px;\nbackground-color: #ffffff;\nbackground-image: url(\"data:image\/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cpath d='M81.28 88H68.413l19.298 19.298L81.28 88zm2.107 0h13.226L90 107.838 83.387 88zm15.334 0h12.866l-19.298 19.298L98.72 88zm-32.927-2.207L73.586 78h32.827l.5.5 7.294 7.293L115.414 87l-24.707 24.707-.707.707L64.586 87l1.207-1.207zm2.62.207L74 80.414 79.586 86H68.414zm16 0L90 80.414 95.586 86H84.414zm16 0L106 80.414 111.586 86h-11.172zm-8-6h11.173L98 85.586 92.414 80zM82 85.586L87.586 80H76.414L82 85.586zM17.414 0L.707 16.707 0 17.414V0h17.414zM4.28 0L0 12.838V0h4.28zm10.306 0L2.288 12.298 6.388 0h8.198zM180 17.414L162.586 0H180v17.414zM165.414 0l12.298 12.298L173.612 0h-8.198zM180 12.838L175.72 0H180v12.838zM0 163h16.413l.5.5 7.294 7.293L25.414 172l-8 8H0v-17zm0 10h6.613l-2.334 7H0v-7zm14.586 7l7-7H8.72l-2.333 7h8.2zM0 165.414L5.586 171H0v-5.586zM10.414 171L16 165.414 21.586 171H10.414zm-8-6h11.172L8 170.586 2.414 165zM180 163h-16.413l-7.794 7.793-1.207 1.207 8 8H180v-17zm-14.586 17l-7-7h12.865l2.333 7h-8.2zM180 173h-6.613l2.334 7H180v-7zm-21.586-2l5.586-5.586 5.586 5.586h-11.172zM180 165.414L174.414 171H180v-5.586zm-8 5.172l5.586-5.586h-11.172l5.586 5.586zM152.933 25.653l1.414 1.414-33.94 33.942-1.416-1.416 33.943-33.94zm1.414 127.28l-1.414 1.414-33.942-33.94 1.416-1.416 33.94 33.943zm-127.28 1.414l-1.414-1.414 33.94-33.942 1.416 1.416-33.943 33.94zm-1.414-127.28l1.414-1.414 33.942 33.94-1.416 1.416-33.94-33.943zM0 85c2.21 0 4 1.79 4 4s-1.79 4-4 4v-8zm180 0c-2.21 0-4 1.79-4 4s1.79 4 4 4v-8zM94 0c0 2.21-1.79 4-4 4s-4-1.79-4-4h8zm0 180c0-2.21-1.79-4-4-4s-4 1.79-4 4h8z' fill='%2349629e' fill-opacity='0.1' fill-rule='evenodd'\/%3E%3C\/svg%3E\");\n}\n#vp {\n\tmargin: 0.5em auto 1em auto;\n\twidth: 80%;\n\tposition: relative;\n\tcolor: #666666;\n}\n#vp p {\n\tmargin: 0px auto 0px auto;\n\twidth: 100%;\n\ttext-align: center;\n\tfont-size: 1.6em;\n\tline-height: 1.4em;\n}\n#vp a {font-weight: bold;}\n#slot-view div {\n\tfont-size: 1.8em;\n\tfont-weight: bold;\n\ttext-align: center;\n\tline-height: 1em;\n\tcolor: #000000;\nbox-sizing: content-box;\n}\n\/*  ================= Animation Start  ====================  *\/\n.spin, .spin2 {\n\twidth: 120px;\n\toverflow: hidden;\n\tposition: absolute;\n\theight: 1200px;\nbox-sizing: content-box;\n}\n.spin {animation: spin 1.5s linear 5;}\n.spin2 {animation: spin2 1.5s linear 5;}\n.one-a .spin, .one-a .spin2 {animation-delay: 0.5s;}\n.two-a .spin, .two-a .spin2 {animation-delay: 0.7s;}\n.three-a .spin, .three-a .spin2 {animation-delay: 0.9s;}\n.four-a .spin, .four-a .spin2 {animation-delay:1.1s;}\n.one-b .spin, .one-b .spin2 {animation-delay: 0.6s;}\n.two-b .spin, .two-b .spin2 {animation-delay: 0.8s;}\n.three-b .spin, .three-b .spin2 {animation-delay: 1s;}\n.four-b .spin, .four-b .spin2 {animation-delay: 1.2s;}\n.one-c .spin, .one-c .spin2 {animation-delay: 0.7s;}\n.two-c .spin, .two-c .spin2 {animation-delay: 0.9s;}\n.three-c .spin, .three-c .spin2 {animation-delay: 1.1s;}\n.four-c .spin, .four-c .spin2 {animation-delay: 1.3s;}\n.one-d .spin, .one-d .spin2 {animation-delay: 0.8s;}\n.two-d .spin, .two-d .spin2 {animation-delay: 1.0s;}\n.three-d .spin, .three-d .spin2 {animation-delay: 1.2s;}\n.four-d .spin, .four-d .spin2 {animation-delay: 1.4s;}\n.one-e .spin, .one-e .spin2 {animation-delay: 0.9s;}\n.two-e .spin, .two-e .spin2 {animation-delay: 1.1s;}\n.three-e .spin, .three-e .spin2 {animation-delay: 1.3s;}\n.four-e .spin, .four-e .spin2 {animation-delay: 1.5s;}\n@keyframes spin { \n\t0%  {top: 0px;}\n\t100%{top: 1200px;}\n}\n@keyframes spin2 { \n\t0%  {top: -1200px;}\n\t100%{top: 0px;}\n}\n.one-a, .one-b, .one-c, .one-d, .one-e, .two-a, .two-b, .two-c, .two-d, .two-e, .three-a, .three-b, .three-c, .three-d, .three-e, .four-a, .four-b, .four-c, .four-d, .four-e {\n\tborder-style: solid;\n\tborder-width: 2px 4px 3px 4px;\n\tborder-color: #000;\n\tmargin: 0 2px;\n\tbackground-color: #EEEEEE;\n\twidth: 120px;\n\toverflow: hidden;\n\theight: 120px;\n\tposition: relative;\n\tfloat: left;\nbox-sizing: content-box;\n}\n.one-a {top: 5px}\n.blue, .red, .orange, .lite-blue, .teal, .yellow, .green, .purple, .gold, .lite-green  {\n\twidth: 120px;\n\theight: 120px;\npadding-top: 13px;\nbox-sizing: content-box;\n}\n.blue {background-color: #0033CC;}\n.red {background-color: #FF0000;}\n.orange{background-color: #FF6600;}\n.lite-blue {background-color: #99CCFF;}\n.teal {background-color: #009999;}\n.yellow {background-color: #FFFF00;}\n.green {background-color: #009933;}\n.purple {background-color: #990099;}\n.gold {background-color: #CC9900;}\n.lite-green {background-color: #00FF00;}\n#slot-view {\n\tpadding: 2px;\n\tborder: 2px ridge #990000;\n\tmargin: -1em auto 1em auto;\n\tposition: relative;\n\twidth: 660px;\n\theight: 510px;\n\tbackground-color: #E3E3FF;\n\toverflow: hidden;\nbox-sizing: content-box;\n}\n\/* =========== Replay Button  =============  *\/\n#control-bar {\n\twidth: 100%;\n\tmargin-right: auto;\n\tmargin-left: auto;\n\ttext-align: center;\n}\n.play {\n\tpadding: 0em 0.4em;\n\tmargin: 0em auto 1em auto;\n\tborder: 5px solid #000000;\n\tfont-size: 1.4em;\n\tline-height: 1.4em;\n\ttext-align: center;\n\tz-index: 99;\n}\n.play:hover {\n\tborder-color: #FF3300;\n\tbackground: #FFFF99;\n\tcursor: pointer;\ncolor: #999;\n}\n.ad-center {text-align: center; width: 80%; margin: 0 auto; border: position: relative; height: 130px;} \n<\/style>\n<div id=\"vp\">\n<p> Looking for FREE Non-Gambling Vegas Style Poker &#038;amp: Keno Games?<br \/> Try <a target=\"_blank\"  href=\"http:\/\/www.videopoker.com\/?u=8064\" onclick=\u201dtrackOutboundLink(\u2018http:\/\/www.videopoker.com\/?u=8064\u2019); return false;\">Video Poker.com<\/a><\/p>\n<\/p><\/div>\n<div class=\"ani-box\">\n<div id=\"slot-wrapper\">\n<div id=\"slot-view\">\n<div class=\"one-a\">\n<div class=\"spin\">\n<div class=\"blue\">&#9730;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel One --><\/p>\n<div class=\"one-b\">\n<div class=\"spin\">\n<div class=\"red\">&#9737;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"red\">&#9737;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel TWO --><\/p>\n<div class=\"one-c\">\n<div class=\"spin\">\n<div class=\"green\">&#9828;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"green\">&#9828;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel THREE --><\/p>\n<div class=\"one-d\">\n<div class=\"spin\">\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FOUR --><\/p>\n<div class=\"one-e\">\n<div class=\"spin\">\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9775;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FIVE --><\/p>\n<div class=\"two-a\">\n<div class=\"spin\">\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel One --><\/p>\n<div class=\"two-b\" >\n<div class=\"spin\">\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel TWO --><\/p>\n<div class=\"two-c\">\n<div class=\"spin\">\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel THREE --><\/p>\n<div class=\"two-d\">\n<div class=\"spin\">\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FOUR --><\/p>\n<div class=\"two-e\">\n<div class=\"spin\">\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FIVE --><\/p>\n<div class=\"three-a\">\n<div class=\"spin\">\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel One --><\/p>\n<div class=\"three-b\">\n<div class=\"spin\">\n<div class=\"red\">&#9737;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"red\">&#9737;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel TWO --><\/p>\n<div class=\"three-c\">\n<div class=\"spin\">\n<div class=\"green\">&#9828;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"green\">&#9828;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel THREE --><\/p>\n<div class=\"three-d\">\n<div class=\"spin\">\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FOUR --><\/p>\n<div class=\"three-e\">\n<div class=\"spin\">\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FIVE --><\/p>\n<div class=\"four-a\">\n<div class=\"spin\">\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel One --><\/p>\n<div class=\"four-b\">\n<div class=\"spin\">\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel TWO --><\/p>\n<div class=\"four-c\">\n<div class=\"spin\">\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel THREE --><\/p>\n<div class=\"four-d\">\n<div class=\"spin\">\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"teal\">&#9774;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FOUR --><\/p>\n<div class=\"four-e\">\n<div class=\"spin\">\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<\/p><\/div>\n<div class=\"spin2\">\n<div class=\"teal\">&#9774;<\/div>\n<div class=\"orange\">&#9785;<\/div>\n<div class=\"lite-blue\">&#9981;<\/div>\n<div class=\"lite-green\">&#9760;<\/div>\n<div class=\"gold\">&#9762;<\/div>\n<div class=\"blue\">&#9734;<\/div>\n<div class=\"red\">&#9737;<\/div>\n<div class=\"green\">&#9828;<\/div>\n<div class=\"purple\">&#9730;<\/div>\n<div class=\"yellow\">&#9824;<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p> <!-- Close Wheel FIVE --><\/p><\/div>\n<p> <!-- Close Slot-View -->\n\t\t<\/div>\n<p> <!-- Close Slot-Wrapper --><\/p>\n<div id=\"control-bar\">\n\t<button class=\"play tooltip\" title=\"Since this is CSS only for the Animation - the Slot wheels will always end up in the same place - JavaScript would be needed for the slot wheel randomization.\">SPIN<\/button>\n<\/div>\n<\/div>\n<p> <!-- Close  Ani  --><\/p>\n<div class=\"below-ani\"> This slot animationd is only seen with a few digital slot manufacturers and involves the rotation of each image window. In a common five wheel slot each of the 20 individual image windows rotate separately. This style can be seen in the <a href=\"https:\/\/thingography.com\/css-slot-machine\/\">Slot Machine CSS animation.<\/a> <\/div>\n<div class=\"ad-center\">\n<div id=\"amzn-assoc-ad-67c2bc85-ab71-468f-8a1a-26d3884fdbc0\"><\/div>\n<p><script async src=\"\/\/z-na.amazon-adsystem.com\/widgets\/onejs?MarketPlace=US&#038;adInstanceId=67c2bc85-ab71-468f-8a1a-26d3884fdbc0\"><\/script><\/div>\n<p><script src=\"https:\/\/thingography.com\/my-things\/wp-content\/uploads\/css-img\/slot-machine\/slot-machine.js\"><\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Looking for FREE Non-Gambling Vegas Style Poker &#038;amp: Keno Games? Try<\/p>\n","protected":false},"author":2,"featured_media":2602,"comment_status":"closed","ping_status":"open","sticky":false,"template":"ani-post-single.php","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[6,4,5,177,178,179],"class_list":["post-1717","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-animation","tag-animation","tag-css","tag-css-animation","tag-slot","tag-slot-machine","tag-slot-reels"],"_links":{"self":[{"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/posts\/1717","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/comments?post=1717"}],"version-history":[{"count":1,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/posts\/1717\/revisions"}],"predecessor-version":[{"id":2912,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/posts\/1717\/revisions\/2912"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/media\/2602"}],"wp:attachment":[{"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/media?parent=1717"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/categories?post=1717"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thingography.com\/wp-json\/wp\/v2\/tags?post=1717"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}