User:Becasita/test.css

Note: After saving, you have to bypass your browser's cache to see the changes. Internet Explorer: hold down Ctrl and click the Refresh or Reload button. Firefox: hold down ⇧ Shift while clicking Reload (or press Ctrl+⇧ Shift+R). Google Chrome and Safari users can just click the Reload button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

/* Main container. */
#mp
{
	display: flex;
}

/* Left/Right containers. */
.mp-left, .mp-right
{
	display: flex;
	flex-direction: column;
	margin: 0em 0.4em;
}
/* Right container. */
.mp-right
{	/* Fixed max width. */
	max-width: 25em;
}

/* Screens with max-width of 1000px (might need to be changed) */
@media screen and (max-width: 1000px)
{
	/* Main container. */
	#mp
	{	/* Display block, to make stuff linear, instead of side-by-side. */
		display: block;
	}
	/* Right container. */
	.mp-right
	{	/* Unset the max width limitation. */
		max-width: unset;
	}
}

/********************************************
 * Mobile stuff for set gallery and set list.
 */
.skin-minerva .content .card-list {
	display: table;
	width: 100% !important; /* I hate this, but the default uses it too. */
}
.skin-minerva .content .card-list caption {
	text-align: center;
	font-size: 110%;
}

@media (max-width: 635px) {
	.skin-minerva .card-list tr {
		margin: 0.5em;
		display: block;
	}
	.skin-minerva .card-list tr:nth-child(odd) {
		background-color: #EEE;
	}
	.skin-minerva .card-list td, .card-list th {
		display: block;
		margin: -1px;
	}
}