.con_image { width: 25%; padding-top: 25%; position: relative; overflow: hidden; }
.con_image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }

#final-message {
	height: 100%;
	width: 100%;
	position: absolute;
	background: rgba(0,0,0,0.7);
	color: #fff;
	font-size: 34px;
	line-height: 38px;
	text-align: center;
	justify-content: center;
	align-items: center;
}

#final-message.display-none {display:none}

#won-code {
	font-size:44px;
	/*font-weight: bold;*/
	text-shadow: 2px 0 #F9F8F8, -1px 0 yellow, -2px 0 green;
}
#won-code a {
	color: #fff;
	text-decoration-color: blue;
	text-decoration: underline;
}

#header {
	margin: auto;
	text-align: center;
	height: calc(100% - 523px);
	
	border-bottom: 1px solid #fff;
	position: relative;
	font-size: 300%;
}
#header::after {
	content: "";
	background: url(banner.jpg);
	opacity: 0.5;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	position: absolute;
	z-index: -1;   
}
h1 {
	padding-top: 10px;
	padding-bottom: 10px;
	color: #111;
	font-size: 32px;
	text-align: center;
	text-shadow: 0 0 2px #fff;
}
h2 {
	padding-top: 5px;
	color: #111;
	font-size: 22px;
	text-align: center;
	text-shadow: 0 0 2px #fff;
}

* {
	padding:0;
	margin:0;
	border:0;
}
 html, body {
	height: 100%;
	font:normal normal normal 100% Arial;
}
#email {
	position: absolute;
	bottom: 20px;
	width: 300px;
	margin: auto;
	left: calc(50% - 150px);
	line-height: 24px;
	font-size: 16px;
	padding: 6px 8px;
	box-shadow: inset 1px 1px 2px 0px #ccc;
	border: 1px solid #aaa;
	border-radius: 6px;
    /*background: #efefef;
    */
}
.shake {
	animation-duration: 1s;
	animation-fill-mode: both;
	animation-name: shake;
}
 @keyframes shake {
	0%, 100% {
	   transform: translateX(0);
    }
	10%, 30%, 50%, 70%, 90% {
	   transform: translateX(-10px);
    }
	20%, 40%, 60%, 80% {
	   transform: translateX(10px);
    }
}
/* GAME */
 #stage {
	position: relative;
	background-image: url(slot_casino.gif);
	background-repeat: no-repeat;
    /*background-attachment: fixed;
    */
	background-position: center middle ;
	background-size: cover;
	margin: 0;
	padding: 0;
	margin: 0 auto;
	width: 800px;
	height: 523px;
    /*max-width: 500px;
    */
    /*padding: 0 0 40px;
    */
}
#stage * {
	z-index: 1;
}
 .perspective-on {
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	perspective: 1000px;
    /* Setting the perspective of the contents of the stage but not the stage itself*/
}
 .perspective-off {
	-webkit-perspective: 0;
	-moz-perspective: 0;
	perspective: 0;
}
 #rotate {
	margin: 0 auto 0;
    /*width: 810px;
    */
	width: 50%;
    /*height: 548px;
    */
    /*height: 100%;
    */
	padding-top: 206px;
	transform-style: preserve-3d;
}
 .ring:first-child{
    width:7%;
}
 .ring {
	margin: 0 auto;
	height: 80px;
	width: 28%;
	float: left;
	transform-style: preserve-3d;
}
 .slot {
	position: absolute;
	width: 100%;
	height: 80px;
	box-sizing: border-box;
	opacity: 0.9;
	color: rgba(0,0,0,0.9);
	background: #fff;
	border: solid 2px #000;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
}
 .backface-on {
	-webkit-backface-visibility: visible;
	-moz-backface-visibility: visible;
	backface-visibility: visible;
}
 .slot p {
	height: 100%;
	width: 100%;
	margin: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
 label {
	cursor: pointer;
	display: inline-block;
	width: 45%;
	text-align: center;
}
 .tilted {
	transform: rotateY(45deg);
}
/*=====*/
 .spin-0 {
	transform: rotateX(-3600deg);
}
 .spin-1 {
	transform: rotateX(-3630deg);
}
 .spin-2 {
	transform: rotateX(-3660deg);
}
 .spin-3 {
	transform: rotateX(-3690deg);
}
 .spin-4 {
	transform: rotateX(-3720deg);
}
 .spin-5 {
	transform: rotateX(-3750deg);
}
 .spin-6 {
	transform: rotateX(-3780deg);
}
 .spin-7 {
	transform: rotateX(-3810deg);
}
 .spin-8 {
	transform: rotateX(-3840deg);
}
 .spin-9 {
	transform: rotateX(-3870deg);
}
 .spin-10 {
	transform: rotateX(-3900deg);
}
 .spin-11 {
	transform: rotateX(-3930deg);
}
/*=====*/
 @keyframes back-spin {
    /*0% {
	    transform: rotateX(0deg);
    }
    */
	100% {
	    transform: rotateX(30deg);
    }
}
 @keyframes tiltin {
	0% {
	    transform: rotateY(0deg);
    }
	50% {
	    transform: rotateY(0deg);
    }
	100% {
	    transform: rotateY(45deg);
    }
}
 @keyframes tiltout {
	0% {
	    transform: rotateY(45deg);
    }
	100% {
	    transform: rotateY(0deg);
    }
}
 @keyframes spin-0 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3600deg);
    }
}
 @keyframes spin-1 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3630deg);
    }
}
 @keyframes spin-2 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3660deg);
    }
}
 @keyframes spin-3 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3690deg);
    }
}
 @keyframes spin-4 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3720deg);
    }
}
 @keyframes spin-5 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3750deg);
    }
}
 @keyframes spin-6 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3780deg);
    }
}
 @keyframes spin-7 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3810deg);
    }
}
 @keyframes spin-8 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3840deg);
    }
}
 @keyframes spin-9 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3870deg);
    }
}
 @keyframes spin-10 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3900deg);
    }
}
 @keyframes spin-11 {
	0% {
	    transform: rotateX(30deg);
    }
	100% {
	    transform: rotateX(-3930deg);
    }
}
 #confetti {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 800px;
	height: 100px;
    /*top:200px;
    */
	position:absolute;
}
#confetti.display-none {display:none}
 .confetti-piece {
	position: absolute;
	width: 8px;
	height: 16px;
	background: #ffd300;
	top: 0;
	opacity: 0;
}
 .confetti-piece:nth-child(1) {
	left: 7%;
	-webkit-transform: rotate(78deg);
	transform: rotate(78deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 348ms;
	animation-delay: 348ms;
	-webkit-animation-duration: 821ms;
	animation-duration: 821ms;
}
 .confetti-piece:nth-child(2) {
	left: 14%;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 432ms;
	animation-delay: 432ms;
	-webkit-animation-duration: 1118ms;
	animation-duration: 1118ms;
}
 .confetti-piece:nth-child(3) {
	left: 21%;
	-webkit-transform: rotate(79deg);
	transform: rotate(79deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 367ms;
	animation-delay: 367ms;
	-webkit-animation-duration: 746ms;
	animation-duration: 746ms;
}
 .confetti-piece:nth-child(4) {
	left: 28%;
	-webkit-transform: rotate(29deg);
	transform: rotate(29deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 459ms;
	animation-delay: 459ms;
	-webkit-animation-duration: 938ms;
	animation-duration: 938ms;
}
 .confetti-piece:nth-child(5) {
	left: 35%;
	-webkit-transform: rotate(-49deg);
	transform: rotate(-49deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 500ms;
	animation-delay: 500ms;
	-webkit-animation-duration: 1174ms;
	animation-duration: 1174ms;
}
 .confetti-piece:nth-child(6) {
	left: 42%;
	-webkit-transform: rotate(-49deg);
	transform: rotate(-49deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 213ms;
	animation-delay: 213ms;
	-webkit-animation-duration: 1002ms;
	animation-duration: 1002ms;
}
 .confetti-piece:nth-child(7) {
	left: 49%;
	-webkit-transform: rotate(59deg);
	transform: rotate(59deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 231ms;
	animation-delay: 231ms;
	-webkit-animation-duration: 751ms;
	animation-duration: 751ms;
}
 .confetti-piece:nth-child(8) {
	left: 56%;
	-webkit-transform: rotate(-11deg);
	transform: rotate(-11deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 127ms;
	animation-delay: 127ms;
	-webkit-animation-duration: 849ms;
	animation-duration: 849ms;
}
 .confetti-piece:nth-child(9) {
	left: 63%;
	-webkit-transform: rotate(-50deg);
	transform: rotate(-50deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 476ms;
	animation-delay: 476ms;
	-webkit-animation-duration: 771ms;
	animation-duration: 771ms;
}
 .confetti-piece:nth-child(10) {
	left: 70%;
	-webkit-transform: rotate(-70deg);
	transform: rotate(-70deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 439ms;
	animation-delay: 439ms;
	-webkit-animation-duration: 1069ms;
	animation-duration: 1069ms;
}
 .confetti-piece:nth-child(11) {
	left: 77%;
	-webkit-transform: rotate(24deg);
	transform: rotate(24deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 7ms;
	animation-delay: 7ms;
	-webkit-animation-duration: 749ms;
	animation-duration: 749ms;
}
 .confetti-piece:nth-child(12) {
	left: 84%;
	-webkit-transform: rotate(-40deg);
	transform: rotate(-40deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 101ms;
	animation-delay: 101ms;
	-webkit-animation-duration: 904ms;
	animation-duration: 904ms;
}
 .confetti-piece:nth-child(13) {
	left: 91%;
	-webkit-transform: rotate(28deg);
	transform: rotate(28deg);
	-webkit-animation: makeItRain 2000ms infinite ease-out;
	animation: makeItRain 2000ms infinite ease-out;
	-webkit-animation-delay: 26ms;
	animation-delay: 26ms;
	-webkit-animation-duration: 726ms;
	animation-duration: 726ms;
}
 .confetti-piece:nth-child(odd) {
	background: #17d3ff;
}
 .confetti-piece:nth-child(even) {
	z-index: 1;
}
 .confetti-piece:nth-child(4n) {
	width: 5px;
	height: 12px;
	-webkit-animation-duration: 2000ms;
	animation-duration: 2000ms;
}
 .confetti-piece:nth-child(3n) {
	width: 3px;
	height: 10px;
	-webkit-animation-duration: 2500ms;
	animation-duration: 2500ms;
	-webkit-animation-delay: 2000ms;
	animation-delay: 2000ms;
}
 .confetti-piece:nth-child(4n-7) {
	background: #ff4e91;
}
 @-webkit-keyframes makeItRain {
	from {
	    opacity: 0;
    }
	50% {
	    opacity: 1;
    }
	to {
	    -webkit-transform: translateY(200px);
	    transform: translateY(200px);
    }
}
 @keyframes makeItRain {
	from {
	    opacity: 0;
    }
	50% {
	    opacity: 1;
    }
	to {
	    -webkit-transform: translateY(200px);
	    transform: translateY(200px);
    }
}
 #play {
	display: inline-block;
	z-index: 0;
	width: 200px;
	text-align: center;
	position: absolute;
	top:8px;
	right:9px;
	-moz-box-shadow:inset 0px 1px 0px 0px #cf866c;
	-webkit-box-shadow:inset 0px 1px 0px 0px #cf866c;
	box-shadow:inset 0px 1px 0px 0px #cf866c;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d0451b), color-stop(1, #bc3315));
	background:-moz-linear-gradient(top, #d0451b 5%, #bc3315 100%);
	background:-webkit-linear-gradient(top, #d0451b 5%, #bc3315 100%);
	background:-o-linear-gradient(top, #d0451b 5%, #bc3315 100%);
	background:-ms-linear-gradient(top, #d0451b 5%, #bc3315 100%);
	background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d0451b', endColorstr='#bc3315',GradientType=0);
	background-color:#d0451b;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #942911;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:28px;
	padding:7px 32px;
	text-decoration:none;
	text-shadow:0px 2px 1px #854629;
}
 #play:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bc3315), color-stop(1, #d0451b));
	background:-moz-linear-gradient(top, #bc3315 5%, #d0451b 100%);
	background:-webkit-linear-gradient(top, #bc3315 5%, #d0451b 100%);
	background:-o-linear-gradient(top, #bc3315 5%, #d0451b 100%);
	background:-ms-linear-gradient(top, #bc3315 5%, #d0451b 100%);
	background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bc3315', endColorstr='#d0451b',GradientType=0);
	background-color:#bc3315;
}
 #play:active {
    /*position:relative;
    */
	top: 11px;
}
 #email_subscribe {
	z-index: 2147483645;
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
}
#final-message {
	z-index: 2147483645;
}