.front, .back {
	width: auto !important;
	height:  max-content;
	padding: 15px;
	background-color: white;
	border-radius: 5px;
	box-shadow: 0px 1px 6px rgba(0,0,0, 0.4);
}
@media only screen and (max-width: 767px){
	div.back, div.front{
		min-height: 56vw !important;;
	}
}

@media only screen and (max-width: 540px){
	div.back, div.front{
		min-height: 53vw !important;;
	}
}
@media only screen and (max-width: 430px){
	div.back, div.front{
		min-height: 50vw !important;;
	}
}
@media only screen and (max-width: 1086px){
	div.back, div.front{
		min-height: 56vw !important;
}
}
@media only screen and (max-width: 850px){
.front>p, .back>p{
	font-size: larger !important;
}
}
@media only screen and (max-width: 457px){
.front>p, .back>p{
	font-size: large !important;
}
}
@media only screen and (max-width: 380px){
	.front>p, .back>p{
		font-size: medium !important;
	}
}
img.back, img.front{
	padding: 0;
}
.front>p, .back>p{
	margin: auto;
	text-align: center;
	font-size: x-large;
}
div.back, div.front{
	min-height: 480px;
	display: flex;
}
.card{
	padding: 5px;
}