	body {background-color:#bbb}
	
    label, input, textarea {display:block; font-size:1.3em;}
    
    input, textarea {padding:5px; height:auto;width:auto;}
	
	h1 {
		margin-bottom:1em;
	}
	
	article hgroup {
		display:block;
		width:450px;
		margin:0 auto;
	}
	
	article hgroup h1 {
		font-size: 2em;
		margin-bottom: 0px;
	}
	article hgroup h2 {
		font-size: 1.3em;
		margin-bottom: 30px;
		font-style: italic;
	}
	
	div.ui-flashcard-app {
		height: 350px;
		width:560px;
		margin:0 auto;
		-webkit-perspective: 500;
	}
	
	div.ui-flashcard-app div.ui-flashcard-pannel-left, div.ui-flashcard-app div.ui-flashcard-pannel-right, div.ui-flashcard-group {
		height:310px;
		display:inline-block
	}
	
	div.ui-flashcard-app div.ui-flashcard-pannel-left, div.ui-flashcard-app div.ui-flashcard-pannel-right {
		width:50px;
		position:relative;
	}
	
	div.ui-flashcard-app div.ui-flashcard-pannel-left button, div.ui-flashcard-app div.ui-flashcard-pannel-right button {
		line-height:310px;
		vertical-align: middle;
		display:inline-block;
		position:relative;
		background-color:transparent;
		border-width:0px;	
	}
	
	div.ui-flashcard-app div.ui-flashcard-pannel-left button img, div.ui-flashcard-app div.ui-flashcard-pannel-right button img {
		line-height:310px;
		vertical-align: middle;
		display:inline-block;
	}
	
	div.ui-flashcard-app div.ui-flashcard-pannel-left {
		float:left;
		text-align:left;
	}
	
	div.ui-flashcard-app div.ui-flashcard-pannel-right {
		float:right;
		text-align:right;
	}
	
	div.ui-flashcard-group {
		width:460px;
		margin: 0 auto;
		position:relative;
	}	
	
	div.ui-flashcard-group div.ui-flashcard, div.ui-flashcard-group .ui-flashcard-front, div.ui-flashcard-group .ui-flashcard-back {
		display:block;
		width:448px;
		height:298px;
		float: left;
		position: absolute;
		top: 0;
		left: 0;
		z-index:0;
	}
	
	div.ui-flashcard-group div.ui-flashcard {
		width:450px;
		height:300px;
		-webkit-perspective: 600;
	}
	
	div.ui-flashcard-group div.next {
		z-index: 5;
		top:5px;
		left: 5px;
	}
	
	div.ui-flashcard-group div.selected {
		z-index: 10;
		top: 10px;
		left: 10px;
		-webkit-perspective: 500; 
		position:relative;
	}
	
	div.ui-flashcard-group div.selected, div.ui-flashcard-group div.next, div.ui-flashcard-group div.previous {

	}
	
	.ui-flashcard-front, .ui-flashcard-back {
		-webkit-transition: none 0 ease-in-out;
		-webkit-backface-visibility: hidden;
		border: 1px solid #000;
		background-color:white;
		-webkit-transform: rotateX(0deg);
		-webkit-transform: rotateY(0deg);
	}
	
	div.ui-flashcard-group .selected .animate {
		-webkit-transform-style: preserve-3d;
		-webkit-transition: all .5s ease-in-out;
		-webkit-backface-visibility: hidden;

		-webkit-transform: rotateX(0deg);
		-webkit-transform: rotateY(0deg);
	}
	
	div.ui-flashcard-group .selected .ui-flashcard-front{
		-webkit-box-shadow: 0px 0px 5px #aaaaaa;
		-webkit-transform: rotateY(0deg);
	}
	
	div.ui-flashcard-group .selected.flip .ui-flashcard-front {
		-webkit-box-shadow: 0px 0px 5px #aaaaaa;
		-webkit-transform: rotateY(180deg);
	}
	
	div.ui-flashcard-group .selected .ui-flashcard-back {
		-webkit-box-shadow: 0px 0px 5px #aaaaaa;
		-webkit-transform: rotateY(-180deg);
	}
	
	div.ui-flashcard-group .selected.flip .ui-flashcard-back {
		-webkit-box-shadow: 0px 0px 5px #aaaaaa;
		-webkit-transform: rotateY(0deg);
	}
	
	div.ui-flashcard-group div span {
		font-size: 3em;
		width: 100%;
		display: inline-block;
		text-align: center;
		margin-top: 60px;
	}
