/*
The purpose of table-wrapper is solely for the save graphic fork where we want two
tables to be side by side if there is enough room, else one above the other.
This requres that they be within a div of class="table-srapper".
*/

/* SEEMS UNNECESSARY
*
{
	box-sizing: border-box;
}
*/

.tablrow
{
	/* width: 50%; NO, needs to be default = 100% */
	/* border: 1px solid green; */
	margin-left:-5px;
	margin-right:-5px;
	padding: 5px;
}

.tablrow::after
{
	content: "";
	clear: both;
	display: table;
}

.tablcol
{
/*
	margin-left:auto;  I WAS UNABLE TO CENTER THE TABLES.
	margin-right:auto;
*/
	float: left; /* essential for stacking. right, center fail to stack.  */
	width: 180px; /* stacks when 50% */
	padding: 5px;
	/* border: 1px solid red;	*/
}

/* Minimum width of entire Firefox or Chrome window is 500 px for any page. */
/* 800 works about same as 100. 1200 stacks too soon.  */
@media screen and (max-width: 800px)
{
	.tablcol
	{
		width: 100%;
	}
}

.tablstyle
{
/* NO effect presumably because each table is in a float:left; div.
	margin-left:auto;
	martin-right:auto;
*/
	text-align: center;
	border-collapse:collapse;	
	border-bottom: 1px solid black;	*/
}

/* END fg-tables.css */