img {
	max-height: 100%;
	margin: auto;
}
span.letter.ui-draggable.ui-draggable-handle.dropped {
	color: #fff !important;
}


.card {
	width: 100%;
	padding-bottom: 132.5%;
	position: relative;
	overflow: hidden;
	/*border-style: solid;*/
	/*border-width: 0.2rem;*/
}
.card,
.card .face {
	border-radius: 0.9rem;
}
.card .face.front {
	padding: 0.5rem;
}
.card .face.front > div:not(.img) {
	border-radius: 0.8rem;
}
.card .face {
	background-size: 96%;
}
.card .face.back {
	background-image: url("../images/card-back.png");
}
.card .face.front {
	background-image: url("../images/card-front.png");
}

.card .face.front .img {
	position: absolute;
	width: 92.4%;
	left: 3.8%;
	height: 85%;
	top: 7.5%;
}
.card .face {
	position: absolute;
	height: 100%;
	width: 100%;
}

.ui-draggable {
	cursor: -webkit-grab;
	cursor: grab;
	z-index: 8 !important;
}
.ui-draggable:hover {
	z-index: 9 !important;
}
.ui-draggable-dragging {
	z-index: 10 !important;
}

/*SCRAMBLED*/
.game[data-type="scrambled"] img {
	height: 55vh;
}
.game[data-type="scrambled"] img {
	padding: 1vh 0;
}
/*adapt elems to large aspect ratio*/
body.ar-large .game[data-type="scrambled"] img {
	height: 43vh;
}
.game[data-type="scrambled"] nav {
	padding-top: 2.5vh
}
body[data-current-type="scrambled"] .resource-container {
	padding-bottom: 0;
}
.letter {
	display: inline-block;
	width: 2.5rem;
	margin: 0 .3rem;
	font-size: 2rem;
	line-height: 1.39;
	text-transform: uppercase;

	-webkit-touch-callout: none !important; /* iOS Safari */
	-webkit-user-select: none !important; /* Safari */
	-khtml-user-select: none !important; /* Konqueror HTML */
	-moz-user-select: none !important; /* Firefox */
	-ms-user-select: none !important; /* Internet Explorer/Edge */
	user-select: none !important;
}
.word-scrambled .word .letter.dropped {
	border-color: transparent !important;
}
.word .letter {
	border-width: 0.1rem !important;
	border-style: solid;
}
.word .letter {
	border-radius: 0.5rem;
}
.initial.letter {
	border-width: 0 !important;
}
.word-scrambled .word .letter {
}
.word-answer .word:first-child .letter:first-child {
	margin-left: 0;
}
.word-answer .word:last-child .letter:last-child {
	margin-right: 0;
}
.word-answer .word .letter {
	color: transparent;
}
body.debug .word-answer .word .letter {
	color: rgba(0,0,0, 0.2);
}
body[data-current-type="scrambled"] div.resource-container footer {
	display: none;
}

/*MEMORY*/
.scene {
	-webkit-perspective: 600px;
	perspective: 600px;
}
.memory-card {
	-webkit-transition: transform .6s;
	transition: transform .6s;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}
.memory-card .face {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	/*	this can't belong of .card, breaks backface-visibility */
	overflow: hidden;
}
.card.memory-card {
	overflow: visible;
}
.face.back {}
.face.front {
	border-radius: 0.8rem;
	-webkit-transform: rotateY( 180deg );
	transform: rotateY( 180deg );
}
.game[data-type="memory"] div[data-field="row"].clone .img-text,
.game[data-type="memory"] div[data-field="row"]:not(.clone) img {
	display: none;
}
/*exception game: no images, texts only*/
.game[data-type="memory"][data-id="box2_sect1_file2_game1"] div[data-field="row"].clone .img-text {
	display: block;
}
.game[data-type="memory"][data-id="box2_sect1_file2_game1"] div[data-field="row"].clone img {
	display: none;
}
.card.memory-card .face.front .img {
	position: relative;
	left: 0;
	top: 0;
}
.card.memory-card .face.front .img-text { }
.memory-card.flipped {
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

body[data-current-type="memory"] .resource-container footer.nav .row > div {
	display: none !important;
}
body[data-current-type="memory"] .resource-container footer.nav .row > div:nth-child(2) {
	display: block !important;
}

body[data-current-field="game"] #modal-result .modal-body > div:not(.msg) {
	display: none;
}
body[data-current-field="game"] #modal-result .modal-body > div.msg {
	text-transform:uppercase;
}

/*exceptions*/
div[data-id="box2_sect1_file6_game1_row3"] .img-text {
	font-size: 0.65rem !important;
}
div[data-id="box2_sect1_file8_game1_row9"] .letter,
div[data-id="box2_sect1_file27_game1_row1"] .letter {
	width: 2.1rem;
}