* {
	margin: 0;
	padding: 0;
}

html {
	width: 100%;
	height: 100%;
}

body {
	font-family: sans-serif;
	background-color: #e9e9e9;
	overflow-x: hidden;
	cursor: default;
}

#loading {
	position: fixed;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	display: none;
	background-color: #fff;
}

#loading p {
	position: absolute;
	bottom: 50px;
	left: 0;
	right: 0;
	text-align: center;
}

#progress-bar {
	position: absolute;
	bottom: 5px;
	width: 99%;
	height: 20px;
	border: 1px solid #aaa;
}

#percentage {
	display: inline-block;
	position: static;
	height: 100%;
	width: 0px;
	background-color: #03A9F4;
}

#controls {
	background-color: #fff;
}

/*#controls */button {
	border: 0;
	background-color: #fff;
	margin: 0 5px;
	padding: 5px;
	cursor: pointer;
	text-transform: capitalize;
}

#controls button:hover {
	color: #03A9F4;
	text-decoration: underline;
}

#controls button:disabled {
	color: #ddd;
}

#content {
	width: 100%;
	height: 100%;
}

.card_holder {
	background-color: #ccc;
	position:absolute;
	border-radius: 5px;
	/*z-index: -1;*/
}

.card {
	position: 	absolute;
	transition: left 400ms, top 400ms, box-shadow 200ms;
	-webkit-transition: left 400ms, top 400ms, box-shadow 200ms;
	box-shadow: 0;
	border-radius: 5px;
}

.card img {
	width: inherit;
	height: inherit;
	position: absolute;
	border: 0;
	outline: 0;
	top: 0;
	left: 0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transition: transform 400ms;
	-webkit-transition: transform 400ms;
}

.face {
	transform: rotateY(190deg);
}

.back {
	transform: rotateY(0deg);
}

.vis {
	transform: rotateY(0deg);
}

.hid {
	transform: rotateY(190deg);
}

#stack {
	z-index: 999;
	border: 1px solid black;
	opacity: 0.1;
	box-sizing: border-box;
}

#three_cards {
	display: none;
}

.no_transist {
	transition: none;
	-webkit-transition: none;
}

.selected {
    box-shadow: 1px 1px 10px orange;
}

div#full {
    width: 100%;
    height: 100%;
    position: fixed;
	z-index: 999;
}

.hint_from {
    box-shadow: 2px 2px 30px #03A9F4;
}

.hint_to {
	transition: none;
	-webkit-transition: none;
    box-shadow: 2px 2px 30px #FF9800;
}

#virtual_mouse {
	transition: left 200ms, top 200ms;
	position: absolute;
	top: 50px;
	left: 10px;
	z-index: 9999;
	display: none;
}

#settings_menu {
	padding-top: 15px;
	position: absolute;
	background-color: #aaa;
	z-index: 99999;
	display: none;
}

select {
	width: 100px;
}