.f22row {clear: both; margin: 0 0 20px 0; max-width: 100%;  }
.f22row:after, .f22row .inner:after {content: ".";    visibility: hidden;    display: block;    height: 0;   clear: both; }
	.col { float: left; padding: 0 2% 0 0; margin-bottom: 20px; }
	.col { width: 98%;   }
	.col_2 .col { width: 48%;   }
	.col_3 .col { width: 31.3%;}
	.col_4 .col { width: 23%;  }
	.col_6 .col { width: 14.6%;   }
	.col_8 .col { width: 10.5%;   }
	
	
	
@media screen and (min-width: 320px) and (max-width: 680px) {
	.col { width: 98%;   }
	.col_2 .col { width: 98%;   }
	.col_3 .col { width: 98%; margin-bottom: 1em; }
	.col_4 .col { width: 48%; min-height: 500px;  }
	.col_6 .col { width: 31.3%;   }
	.col_8 .col { width: 23%;   }

}