@charset "UTF-8";
/** Created by Zura Jijavadze on 11/13/2017. © www.leader-bet.com */
.flip-counter-wrapper { display: table; padding-left: 10px; position: absolute; right: 150px; top: 9px; /* PLAY */ /* SHADOW */ /*DOWN*/ }

.flip-counter-wrapper .jackpot-name { left: 50%; top: 100%; padding-top: 2px; color: #f7c212; position: absolute; text-transform: uppercase; letter-spacing: 5px; font-size: 20px; transform: translateX(-50%); font-family: barialnus, sans-serif; }

.flip-counter-wrapper ul.flip { position: relative; float: left; margin: 1px; width: 33px; height: 46px; font-size: 30px; font-weight: normal; line-height: 45px; border-radius: 3px; font-family: Roboto, nakheelgeo, sans-serif; list-style: none; }

.flip-counter-wrapper ul.flip li { z-index: 1; position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.flip-counter-wrapper ul.flip li:first-child { z-index: 2; }

.flip-counter-wrapper ul.flip .digit-wrapper { display: block; height: 100%; perspective: 200px; }

.flip-counter-wrapper ul.flip .digit-wrapper div { z-index: 1; position: absolute; left: 0; width: 100%; height: 50%; overflow: hidden; }

.flip-counter-wrapper ul.flip .digit-wrapper div .shadow { position: absolute; width: 100%; height: 100%; z-index: 2; }

.flip-counter-wrapper ul.flip .digit-wrapper div.up { transform-origin: 50% 100%; top: 0; }

.flip-counter-wrapper ul.flip .digit-wrapper div.up:after { content: ""; position: absolute; top: 22px; left: 0; z-index: 5; width: 100%; height: 3px; background-color: rgba(0, 0, 0, 0.28); }

.flip-counter-wrapper ul.flip .digit-wrapper div.down { transform-origin: 50% 0; bottom: 0; }

.flip-counter-wrapper ul.flip .digit-wrapper div div.inn { position: absolute; left: 0; z-index: 1; width: 100%; height: 200%; color: #BDBDBD; text-shadow: 0 1px 2px #000; text-align: center; background-color: #373737; border-radius: 3px; font-family: lbmt, sans-serif; }

.flip-counter-wrapper ul.flip .digit-wrapper div.up div.inn { top: 0; }

.flip-counter-wrapper ul.flip .digit-wrapper div.down div.inn { bottom: 0; }

.flip-counter-wrapper ul.flip li.before { z-index: 3; }

.flip-counter-wrapper ul.flip li.active { animation: asd .5s .5s linear both; z-index: 2; }

@keyframes asd { 0% { z-index: 2; }
  5% { z-index: 4; }
  100% { z-index: 4; } }

.flip-counter-wrapper ul.flip li.active .down { z-index: 2; animation: turn .5s .5s linear both; }

@keyframes turn { 0% { transform: rotateX(90deg); }
  100% { transform: rotateX(0deg); } }

.flip-counter-wrapper ul.flip li.before .up { z-index: 2; animation: turn2 .5s linear both; }

@keyframes turn2 { 0% { transform: rotateX(0deg); }
  100% { transform: rotateX(-90deg); } }

.flip-counter-wrapper ul.flip li.before .up .shadow { background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black)); background: linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%); animation: show .5s linear both; }

.flip-counter-wrapper ul.flip li.active .up .shadow { background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black)); background: linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%); animation: hide .5s .3s linear both; }

.flip-counter-wrapper ul.flip li.before .down .shadow { background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1))); background: linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%); animation: show .5s linear both; }

.flip-counter-wrapper ul.flip li.active .down .shadow { background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1))); background: linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%); background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%); animation: hide .5s .3s linear both; }

.flip-counter-wrapper .flip-dot { float: left; color: #b0b0b0; font-size: 46px; line-height: 59px; display: inline-block; width: 11px; height: 34px; vertical-align: bottom; text-align: center; }

.flip-counter-wrapper::after { content: ''; display: block; width: 100%; clear: both; }

@keyframes show { 0% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes hide { 0% { opacity: 1; }
  100% { opacity: 0; } }

/*# sourceMappingURL=flip-counter.css.map */