@charset "UTF-8";
/* *********************************************************************************************************************
	One% CSS Grid - 12 Columns Fluid CSS Grid System

	Why One% ? Let’s count ...
		we have 12 columns (magic number divided by 2, 3, 4, 6)

		for 12 columns we need 11 margins

		so if we count margin 3%, then 3% * 11 margins = 33%

		and if we count width of 1 column 5.5%, than 5.5% * 12 columns = 66%

		in the end we have 33% + 66% = 99% aaand ???

		1% is still here so that's the name - One%

	2 starting options ? Let’s count a bit more ...
		1200px - perfectly fits 1280 screens
			12 columns
			margin 3% / 36px (full-width)
			col1 5.5% / 66px (full-width)

		1000px - perfectly fits 1024 screens
			12 columns
			margin 3% / 30px (full-width)
			col1 5.5% / 55px (full-width)
*/
/* *********************************************************************************************************************
 * Main container for all
 */
.onerow:after {
  content: ".";
  clear: both;
  display: block;
  visibility: hidden;
  height: 0px; }

/* *********************************************************************************************************************
 * Common columns definitions
 */
.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
  float: left;
  margin: 0 3% 0 0; }

.last {
  float: right !important; }

.col1.last, .col2.last, .col3.last, .col4.last, .col5.last, .col6.last, .col7.last, .col8.last, .col9.last, .col10.last, .col11.last, .col12 {
  margin: 0; }

.col1 {
  width: 5.5%; }

.col2 {
  width: 14%; }

.col3 {
  width: 22.5%; }

.col4 {
  width: 31%; }

.col5 {
  width: 39.5%; }

.col6 {
  width: 48%; }

.col7 {
  width: 56.5%; }

.col8 {
  width: 65%; }

.col9 {
  width: 73.5%; }

.col10 {
  width: 82%; }

.col11 {
  width: 90.5%; }

.col12 {
  width: 100%;
  margin: 0; }

.col1 img, .col2 img, .col3 img, .col4 img, .col5 img, .col6 img, .col7 img, .col8 img, .col9 img, .col10 img, .col11 img, .col12 img {
  width: 100%;
  height: auto;
  display: block; }

/* *********************************************************************************************************************
 * Disable padding left/right 10px if I'm 1024 or gibber - correct percentage math
 */
@media all and (min-width: 1024px) {
  .onepcssgrid-1000 {
    max-width: 1000px; }

  .onepcssgrid-1000 .onerow {
    padding: 0; } }
/* *********************************************************************************************************************
 * Small devices
 */
@media all and (max-width: 768px) {
  .col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11 {
    float: none;
    width: 100%;
    clear: both;
    margin: 0; }

  .keep_grid .col1, .keep_grid .col2, .keep_grid .col3, .keep_grid .col4, .keep_grid .col5, .keep_grid .col6, .keep_grid .col7, .keep_grid .col8, .keep_grid .col9, .keep_grid .col10, .keep_grid .col11, .keep_grid .col12 {
    float: left;
    margin: 0 3% 0 0;
    clear: none; }
  .keep_grid .col1.last, .keep_grid .col2.last, .keep_grid .col3.last, .keep_grid .col4.last, .keep_grid .col5.last, .keep_grid .col6.last, .keep_grid .col7.last, .keep_grid .col8.last, .keep_grid .col9.last, .keep_grid .col10.last, .keep_grid .col11.last, .keep_grid .col12 {
    margin: 0; }
  .keep_grid .col1 {
    width: 5.5%; }
  .keep_grid .col2 {
    width: 14%; }
  .keep_grid .col3 {
    width: 22.5%; }
  .keep_grid .col4 {
    width: 31%; }
  .keep_grid .col5 {
    width: 39.5%; }
  .keep_grid .col6 {
    width: 48%; }
  .keep_grid .col7 {
    width: 56.5%; }
  .keep_grid .col8 {
    width: 65%; }
  .keep_grid .col9 {
    width: 73.5%; }
  .keep_grid .col10 {
    width: 82%; }
  .keep_grid .col11 {
    width: 90.5%; }
  .keep_grid .col12 {
    width: 100%;
    margin: 0; } }
@media all and (max-width: 500px) {
  .col6 {
    float: none;
    width: 100%;
    clear: both; } }