*
{
	/* margin: 0px;
	padding: 0px; */
}
html
{
	overflow: hidden;
}
body
{
	font-family: arial;
	font-size: 1em;
	background-color: #004000;
	color: #ffffff;
	/* transform: scale(0.8); */
}
/*pre 
{
	height: 50%;
}*/
.board
{
	width: 100%;
	height: 100%;
}
.deck { /* This is same size as board. So we can cycle through each card in dom order without getting other elements */
	width: 100%;
	height: 100%;
	overflow: auto;
}
.card {
	position: absolute;
	perspective: 1000px;
	background-color: transparent;
	width: 180px; /* Need this to flip on center axis */
	height: 252px; /* Need this to flip on center axis */
	transition: transform 0.5s; /* To animate the rotate */
	touch-action: none; /* iOS Prevents page scrolling while dragging card */
}
.card-inner {
	/* border: 1px solid black; */
	position: relative;
	transform-style: preserve-3d;
	/* -webkit-transform-style: preserve-3d; */
	transition: transform 0.5s; /* To animate the flip */
	/* background-image: url("images/Back of Cards - Blue.png"); */
	width: 100%;
	height: 100%;
}
.card img {
	position: absolute;
	border-radius: 10px;
	box-shadow: 0 0.0625em 0.125em rgba(0, 0, 0, 0.15); /* From: https://medium.com/@pakastin/javascript-playing-cards-part-2-graphics-cd65d331ad00 */
	backface-visibility: hidden; 
	-webkit-backface-visibility: hidden; /* ios was not flipping card correctly because of not having this!!!! */
}
.face {
	transform: rotateY(180deg);
}
.rotate
{
	transform: rotate(90deg);
}
.flipped {
	transform: rotateX(180deg);
}
.shuffle-left {
	transform: rotateX(-50deg);
}
.shuffle-right {
	transform: rotateX(50deg);
}
.animate {
	transition: all 1s ease;
	/* transition-delay: 1s; */
}
.dragme
{
	position: absolute;
	top: 100px;
	left: 100px;
	/* z-index: 1; */
/*	border: 1px;
	border-style: solid;
	border-color: transparent; */
}
.score {
	position: absolute;
	font-size: 1.5em;
}
.menu {
	position: relative; /* Needed for z-index */
	float: right;
	/* padding: 0.5em; */
	z-index: 2;
	background-color: #2276BB;
	font-size: 1.5em;
}
.menu a {
	color: #ffffff;
	display: inline-block;
	width: 100%;
	padding: .5em;
	background-color: #000080;
	margin: 5px;
}

@media handheld, only screen and (max-width: 800px), only screen and (max-device-width: 800px)
{
	.menu {
		font-size: 2em;
	}
}