
	.container {
		display: inline-block;	/* SQ: This SHOULD be Block but it results in "SIX" wrapping. */
		width: 100%;
		margin: 0 auto;
	}
	
	figure {
		margin: 0 auto;
		background-color: #ccc;
		line-height: 2em;
		text-align: center;
	}

	figcaption {
		padding: 5px;
		text-align: left;
		font-size: 1em;
		border: 1px solid #ccc;
	}
	
	figcaption p {
		margin: 0;
		line-height: 1.5em;	
	}


	.twocol {
		margin-left: 2.5%;
		margin-bottom: 1%; 
		width: 46.5%;
		float: left;
	}

	.threecol {
		margin-left: 2.5%;
		margin-bottom: 1%; 
		width: 30%;
		float: left;
	}
	
	.fourcol {
		margin-left: 2.5%;
		margin-bottom: 1%;
		width: 21.9%;
		float: left;
	}

	.sixcol {
		margin-left: 2.5%;
		margin-bottom: 1%;
		width: 13.76%;
		float: left;
	}
		
	@media (min-width: 1024px) {
		
		.container {
			width: 98%;
			margin: 0 1%;
		}		
	}

	@media (max-width: 960px) {
		.twocol {
			width: 46.5%;
		}
	
		.threecol {
			width: 46.5%;
		}
	
		.fourcol {
			width: 46.5%;
		}	
		
		.sixcol {
			width: 30.25%;
		}		
	}
	
	@media (max-width: 580px) {
		.twocol {
			width: 95%;
		}
	
		.threecol {
			width: 95%;
		}
		
		.fourcol {
			width: 95%;
		}
		
		.sixcol {
			width: 45.4%;
		}	
	}
