@CHARSET "UTF-8";

.grid {
	margin: 10px 0;
	padding: 0;
}

.grid.compressed {
	margin: 0;
}

.row {
	padding: 4px 0;
}

.grid.compressed .row {
	padding: 0;
}

.col1,.col2,.col3,.col1-3 {
	padding: 4px 0;
	margin: 0;
}

.col1-3 {
	width: 32%;
	padding-left: 1%;
	float: left;
}

.col1 {
	width: 24%;
	padding-left: 1%;
	float: left;
}

.col1.gapless {
	width: 25%;
	padding-left: 0;
}

.col2 {
	width: 49.5%;
	padding-left: 1%;
	float: left;
}

.col2.gapless {
	width: 50%;
	padding-left: 0;
}

.col3 {
	width: 74%;
	padding-left: 1%;
	float: left;
}

.col3.gapless {
	width: 75%;
	padding-left: 0;
}


.col4 {
	width: 100%;
	padding-left: 0;
}

.colthumb {
	float: left;	
	width: 160px;
}

.colall {
	float: left;
	padding-left: 1%;
	width: calc(99% - 160px);
}

.col1:first-child, .col2:first-child {
	padding-left: 0;
}

.grid.compressed .col1,.grid.compressed .col2,.grid.compressed .col3,.grid.compressed .col4,.grid.compressed .col1-3 {
	padding-top: 1px;
}

.grid.border {
	border: 1px solid #aaa;
	border-radius: 4px;
}

@media (max-width: 600px) {
	
	.col1 {
		width: 100%;
		padding-left: 0;
		float: none;
	}
	
	.col2 {
		width: 100%;
		padding-left: 0;
		float: none;
	}

	.col3 {
		width: 100%;
		padding-left: 0;
		float: none;
	}

	.col1-3 {
		width: 100%;
		padding-left: 0;
		float: none;
	}

	.col1.right, .col2.right, .col1.right+.col1 {
		text-align: center;
	}
	
	.col1.right, .col2.right {
		font-weight: bold;
	}

}

@media (max-width: 800px) {
	
	.col2.gapless .col2 {
		width: 49%;
		padding-left: 1%;
		float: left;
	}

	.col2.gapless {
		width: 100%;
		padding-left: 0;
		float: none;
	}	
}

@media (max-width: 500px) {

	.col2.gapless .col2 {
		float: none;
		width: 100%;
		padding: 0;
	}
	
}

.row:before,
.row:after {
	display: table;
	content: ' ';
	clear: both;
}

.padded>*:first-child,.col1>*:first-child,.col2>*:first-child,.col3>*:first-child {
	margin-top: 0;
}

.padded>*:last-child,.col1>*:last-child,.col2>*:last-child,.col3>*:last-child {
	margin-bottom: 0;
}