/* simple */
         body{background-color:#930808;
		 }
		 .slots{position:relative;
		 top:10px;
		 left:0px;
		 max-height:230px;
		 max-width:1025px;
		 overflow:hidden;
		 background-color:black;
		 margin:1px auto 3px auto;
		 border:1px solid  #EDC515;
		 border-radius:10px;
		 -moz-box-shadow: 0px 0px 25px rgb(247, 247, 9);
		-webkit-box-shadow: 0px 0px 25px rgb(247, 247, 9);
		box-shadow: 0px 0px 25px rgb(247, 247, 9);
		 }
		.flip-container {
			-webkit-perspective: 1000;
			-moz-perspective: 1000;
			-ms-perspective: 1000;
			perspective: 1000;
			position:relative;
			-ms-transform: perspective(1000px);
			-moz-transform: perspective(1000px);
    		/*-moz-transform-style: preserve-3d; */
    		-ms-transform-style: preserve-3d; 
	        top: 30px;
			left: 20px;
			border: 0px solid #ccc;
		}

			/* START: Accommodating for IE */
			.flip-container:hover .back, .flip-container.hover .back {
		-webkit-transform: rotateY(0deg);
		-moz-transform: rotateY(0deg);
		-o-transform: rotateY(0deg);
		-ms-transform: rotateY(0deg);
		transform: rotateY(0deg);
		-o-transform: scale(1.0);
		-moz-transform: scale(1.0);
		-webkit-transform: scale(1.0);
		transform: scale(1.0);
		z-index:4;
		-moz-box-shadow: 0px 0px 35px rgb(247, 247, 9);
		-webkit-box-shadow:0px 0px 35pxrgb(247, 247, 9);
		box-shadow: 0px 0px 35px rgb(247, 247, 9);
	
}

		.flip-container:hover .front, .flip-container.hover .front {
		-webkit-transform: rotateY(180deg);
		-moz-transform: rotateY(180deg);
		-o-transform: rotateY(180deg);
		transform: rotateY(180deg);
		
}
		
		/* END: Accommodating for IE */

		.flip-container, .front, .back {
			width: 260px;
			height: 174px;
		}

		.flipper {
			-webkit-transition: 0.6s;
			-webkit-transform-style: preserve-3d;
			-ms-transition: 0.6s;

			-moz-transition: 0.6s;
			-moz-transform: perspective(1000px);
			-moz-transform-style: preserve-3d;
			-ms-transform-style: preserve-3d;

			transition: 0.6s;
			transform-style: preserve-3d;

			position: relative;
		}

		.back {
			-webkit-backface-visibility: hidden;
			-moz-backface-visibility: hidden;
			-ms-backface-visibility: hidden;
			backface-visibility: hidden;

		    -webkit-transition: 0.6s;
		    -webkit-transform-style: preserve-3d;

		    -moz-transition: 0.6s;
		    -moz-transform-style: preserve-3d;

		    -o-transition: 0.6s;
		    -o-transform-style: preserve-3d;

		    -ms-transition: 0.6s;
		    -ms-transform-style: preserve-3d;

		    transition: 0.6s;
		    transform-style: preserve-3d;

			position: relative;
			top: -174px;
			left: 0;
			border:2px solid  #fff;
			border-radius:5px;
		}
.front {
			-webkit-backface-visibility: hidden;
			-moz-backface-visibility: hidden;
			-ms-backface-visibility: hidden;
			backface-visibility: hidden;

		    -webkit-transition: 0.6s;
		    -webkit-transform-style: preserve-3d;

		    -moz-transition: 0.6s;
		    -moz-transform-style: preserve-3d;

		    -o-transition: 0.6s;
		    -o-transform-style: preserve-3d;

		    -ms-transition: 0.6s;
		    -ms-transform-style: preserve-3d;

		    transition: 0.6s;
		    transform-style: preserve-3d;

			position: relative;
			top: 0;
			left: 0;
		
		}
		.front {
			-webkit-transform: rotateY(0deg);
			-ms-transform: rotateY(0deg);
			
			z-index: 2;
			-o-transform: scale(.9);
		-moz-transform: scale(.9);
		-webkit-transform: scale(.9);
		transform: scale(.9);
        border-radius:5px;
		-moz-box-shadow: inset 1px 2px 20px orange;
		-webkit-box-shadow: inset 1px 2px 20px orange;
		box-shadow: inset 1px 2px 20px orange;
		}

		.back {
			background: lightblue;
			-webkit-transform: rotateY(-180deg);
		    -moz-transform: rotateY(-180deg);
		    -o-transform: rotateY(-180deg);
		    -ms-transform: rotateY(-180deg);
		    transform: rotateY(-180deg);
		}

		.front .name {
			font-weight: bold;
			color: #F0C24A;
			position: absolute;
			top: 155px;
			left: 5px;
			right: 0;
			text-align: center;
			text-shadow: 0.08em 0.08em 0.1em #acd7e5;
			font-family: Courier;
			font-size: 1.7em;
			width:220px;
			border-radius:4px;
	                border:0px solid #2D96D7;
		}

		.back-logo {
			position: absolute;
			top: 5px;
			left: 10px;
			width: 260px;
			height: 164px;
			opacity:1;
			
			
		}

		.back-title {
			font-weight: bold;
			color: #F0C24A;
			position: absolute;
			top: 174px;
			left: 0;
			right: 0;
			text-align: center;
			text-shadow: 0.08em 0.08em 0.1em #acd7e5;
			font-family: Courier;
			font-size: 1.7em;
		}

		.back p {
			position: absolute;
			top: 2px;
			left: 0;
			right: 0;
			text-align: center;
			padding: 0 10px;
			font-weight: bold;
			color: #F0C24A;
			font-size:0.9em;
		}
		
/*tooltip class start*/	
.info2{
    position:absolute; /*this is the key*/
    top:-10px;
    left:26px;
    text-decoration:none;
    text-align:center;
	display:block;
	background:#2D96D7;
	border-radius:4px;
	border:1px solid #fff;
	color:#fff;
	font-size:1.35em;
	padding:0 3px 0 3px;
	z-index:4;
  }
 .info2 a{
  text-decoration:none;
  color:#fff;
 } 
.info2:hover{
    position:absolute; /*this is the key*/
    top:-10px;
    left:26px;
    text-decoration:none;
    text-align:center;
	display:block;
	background:#fff;
	border-radius:4px;
	border:1px solid #2D96D7;
	color:#2D96D7;
	font-size:1.35em;
	padding:0 3px 0 3px;
	z-index:4;
  }	
.info{
    position:absolute; /*this is the key*/
    top:-19px;
    left:2px;
    text-decoration:none;
    text-align:center;
	display:block;
	background:#2D96D7;
	border-radius:4px;
	padding:0 5px 0 5px;
	color:#fff;
	font-size:1.8em;
	border:1px solid #fff;
	z-index:5;
  }
.info:hover{
    position:absolute; /*this is the key*/
    top:-19px;
    left:2px;
    text-decoration:none;
    text-align:center;
	display:block;
	background:#fff;
	border-radius:4px;
	padding:0 5px 0 5px;
	color:#2D96D7;
	font-size:1.8em;
	border:1px solid #2D96D7;
	z-index:5;
  }


.info span{display: none}

.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:27px;
	left:-2px;
   min-width:19.4em;
    max-width:19.4em;
	    border-radius:5px;
		-moz-box-shadow: inset 1px 2px 30px #000;
		-webkit-box-shadow: inset 1px 2px 30px  #000;
		box-shadow: inset 1px 2px 30px  #000;
    background-color:darkgreen;
	color:#F0C24A;
    text-align: center;
    padding:5px;
	z-index:5;
	font-size:0.59em;
	opacity:0.9;
	font-weight: bold;
  }

  
/*tooltip class end*/