.tarot-card {
	background: white;
	border: 1px solid #000;
	border-radius: 0.5em;
	margin: 1em;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 166px;
	height: 270px;
}


/* http://tarotprophet.com/6-most-common-tarot-spreads-and-their-uses/ */
.tarot-spread {
	background: forestgreen;
	padding: 1em;
	margin-bottom: 0.5em;
	border: 1px solid darkgreen;

	/* three cards */
	&.three-card {
		figure {
			width: 33.333%;
			max-width: calc(33.333% - .667em);
			margin: 0 0 0 1em;
			float: left;
			&:first-child {
				margin-left: 0;
			}
			.tarot-card {
				width: 100%;
				max-width: 100%;
				height: auto;
				margin: 0 0 1em;
				&.empty{
					background-color: #f59e00;
					cursor: pointer;
					&:before {
						display: block;
						content: '🏵️';
						font-size: 10em;
						text-align: center;
						height: 270px;
						display: flex;
						align-items: center;
					}
				}
				&.inverted {
					img {
						transform: rotate(180deg);
					}
				}
				img {
					margin: 10px 0;
					width: 95%;
					width: calc(100% - 14px);
					height: auto;
				}
			}
			figcaption {
				text-align: center;
				color: #fff;
				font-weight: 600;
				font-size: 1em;
			}
		}
		overflow: hidden;
	}
	.deck-attribution {
		display: block;
		clear: both;
		text-align: right;
		font-size: 10px;
		color: darkgreen;
		font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;

		a {
			color: darkgreen;
		}
	}
}