/*******************************************************
*
* Sequence's Grid Stylesheet
*
*******************************************************/

.container {
  position: relative;
  width: 996px;
  margin: 0 auto;
  padding: 0;
}

.container.full {
	padding: 0 30px;
}

.column, .columns {
  float: left;
	margin-right: 15px;
	margin-left: 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.children-halfs .column,
.one-half.column {
  width: 468px;
}

.children-fourths .column,
.one-fourth.column {
  width: 219px;
}

.three-fourths.column {
  width: 717px;
}

.children-thirds .column,
.one-third.column {
  width: 302px;
}

.two-thirds.column {
  width: 634px;
}

.children-fifths .column,
.one-fifth.column {
  width: 169px;
}

.children-sixths .column,
.one-sixth.column {
  width: 136px;
}


@media only screen and (max-width: 1020px) and (min-width: 959px) {
  .container { width: 948px }

  .children-halfs .column,
  .one-half.column {
    width: 444px;
  }

  .children-fourths .column,
  .one-fourth.column {
    width: 207px;
  }

  .three-fourths.column {
    width: 681px;
  }

  .children-thirds .column,
  .one-third.column {
    width: 285px;
  }

  .two-thirds.column {
    width: 602px;
  }

	.children-fifths .column,
	.one-fifth.column {
		width: 159px;
	}

	
  .children-sixths .column,
  .one-sixth.column {
    width: 128px;
  }

}

/* Stacked layout for table portraite and lower */
@media only screen and (max-width: 959px) {
  .one-half.column,
  .one-fourth.column,
  .three-fourths.column,
  .one-third.column,
  .two-thirds.column,
	.one-fifth.column,
  .one-sixth.column,
  .children-halfs .column,
  .children-thirds .column,
  .children-fourths .column,
	.children-fifths .column,
  .children-sixths .column,
  .column.last {
	padding-right: 0;
	margin: 0 0 30px 0;
	padding: 0 20px;
	width: 49.5%;
  }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  .container { width: 750px; }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
  .container { width: 300px; }
	
  .one-half.column,
  .one-fourth.column,
  .three-fourths.column,
  .one-third.column,
  .two-thirds.column,
	.one-fifth.column,
  .one-sixth.column,
  .children-halfs .column,
  .children-thirds .column,
  .children-fourths .column,
	.children-fifths .column,
  .children-sixths .column,
  .column.last {
	padding-right: 0;
	margin: 0 0 30px 0;
	padding: 0 20px;
	width: 100%;
  }
}
  
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .container { width: 420px; }
}


/* #Clearing
================================================== */

/* Self Clearing Goodness */
.container:after,
.content:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */

.children-halfs:before,
.children-halfs:after,
.children-thirds:before,
.children-thirds:after,
.children-fourths:before,
.children-fourths:after,
.children-sixths:before,
.children-sixths:after,
.more-posts:before,
.more-posts:after,
.container:before,
.container:after,
.sidetabs:before,
.sidetabs:after,
.pagination:before,
.pagination:after,
.content:before,
.content:after,
.columns:before,
.columns:after,
.column:before,
.column:after,
.clearfix:before,
.clearfix:after,
.row-big:before,
.row-big:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; 
}

.children-halfs:after,
.children-thirds:after,
.children-fourths:after,
.children-sixths:after,
.more-posts:after,
.container:after,
.sidetabs:after,
.pagination:after,
.content:after,
.columns:after,
.column:after,
.row:after,
.row-big:after,
.clearfix:after {
  clear: both;
}

.children-halfs,
.children-thirds,
.children-fourths,
.children-sixths,
.more-posts,
.container,
.sidetabs,
.pagination,
.content,
.content,
.columns,
.columns,
.column,
.column,
.row,
.row-big,
.clearfix {
  zoom: 1;
}

/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}