/* page-columns.css
****************************************************************
****************************************************************
****************************************************************/


/* Columns
****************************************************************/

.colset
{
	/* (line:24px / 2) (-margin:20px) */
	margin: 12px -20px;
	margin: 1.2rem -20px;
	/* margin:20px / 2 */
	padding-left: 10px;
	padding-right: 10px;
	overflow: hidden;
}

.colset .col,
.colset .col-article,
.colset .col-sidebar,
.colset .col-1,
.colset .col-1_2,
.colset .col-1_4,
.colset .col-3_4,
.colset .col-1_8,
.colset .col-3_8,
.colset .col-5_8,
.colset .col-7_8,
.colset .col-1_3,
.colset .col-2_3,
.colset .col-1_6,
.colset .col-5_6,
.colset .col-1_12,
.colset .col-5_12,
.colset .col-7_12
{
	float: left;
	display: inline;
	min-height: 1px;
}

.colset .col-right
{
	float: right;
	display: inline;
}

.colset .col-stack
{
	/* line:24px / 2 */
	margin-top: 12px;
	margin-top: 1.2rem;
}

.colset .col-article
{
	/* (grid:100px + margin:20px) * 4 */
	width: 480px;
}

.colset .col-sidebar
{
	/* (grid:100px + margin:20px) * 2 */
	width: 240px;
}

.colset-alt-a-right .col-article
{
	/* ((grid:100px + margin:20px) * 4) - margin:20px */
	width: 460px;
}

.colset-alt-a-right .col-sidebar
{
	/* ((grid:100px + margin:20px) * 2) + margin:20px */
	width: 260px;
}

.colset .col-1    { width: 100%; }
.colset .col-1_2  { width: 50%; /* 100% / 2 */ }
.colset .col-1_4  { width: 25%; /* 100% / 4 */ }
.colset .col-3_4  { width: 75%; /* 100% * 3/4 */ }
.colset .col-1_8  { width: 12.5%; /* 100% / 8 */ }
.colset .col-3_8  { width: 37.5%; /* 100% * 3/8 */ }
.colset .col-5_8  { width: 62.5%; /* 100% * 5/8 */ }
.colset .col-7_8  { width: 87.5%; /* 100% * 7/8 */ }
.colset .col-1_3  { width: 33.3333%; /* 100% / 3 */ }
.colset .col-2_3  { width: 66.6667%; /* 100% * 2/3 */ }
.colset .col-1_6  { width: 16.6667%; /* 100% / 6 */ }
.colset .col-5_6  { width: 83.3333%; /* 100% * 5/6 */ }
.colset .col-1_12 { width:  8.3333%; /* 100% / 12 */ }
.colset .col-5_12 { width: 41.6667%; /* 100% * 5/12 */ }
.colset .col-7_12 { width: 58.3333%; /* 100% * 7/12 */ }

.colset .col-inner
{
	/* margin:20px / 2 */
	margin-left: 10px;
	margin-right: 10px;
}

.colset-alt-a .col-left .col-inner,
.colset-alt-a-left .col-left .col-inner,
.colset-alt-a-both .col-left .col-inner,
.col-inner-alt-a, .col-inner-alt-a-left,
.col-inner-alt-a-both
{
	/* margin:20px - 1px */
	padding-right: 19px;
	border-right: 1px solid #DDDDDD;
}

.colset-alt-a-right .col-right .col-inner,
.colset-alt-a-both .col-right .col-inner,
.col-inner-alt-a-right, .col-inner-alt-a-both
{
	/* margin:20px - 1px */
	padding-left: 19px;
	border-left: 1px solid #DDDDDD;
}

.colset-alt-b,
.colset-alt-b .col-inner
{
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
}


/* Columns Vertical Spacing Fix
****************************************************************/

.colset .col-inner > :first-child,
.colset .col-inner > .nav:first-child > :first-child,
li:first-child > :first-child
{
	margin-top: 0;
}

.colset .col-inner > :last-child,
.colset .col-inner > .nav:last-child > :last-child,
li:last-child > :last-child
{
	margin-bottom: 0;
}

.colset .col-inner > h1:first-child,
.colset .col-inner > h2:first-child,
.colset .col-inner > h3:first-child,
.colset .col-inner > h4:first-child,
.colset .col-inner > h5:first-child,
.colset .col-inner > h6:first-child,
.colset .col-inner > .hgroup:first-child,
.colset .col-inner > .header:first-child,
.colset .col-inner > .section:first-child > h1:first-child,
.colset .col-inner > .section:first-child > h2:first-child,
.colset .col-inner > .section:first-child > h3:first-child,
.colset .col-inner > .section:first-child > h4:first-child,
.colset .col-inner > .section:first-child > h5:first-child,
.colset .col-inner > .section:first-child > h6:first-child,
.colset .col-inner > .section:first-child > .hgroup:first-child,
.colset .col-inner > .section:first-child > .header:first-child
{
	/* (line:24px / 2) */
	margin-top: 12px;
	margin-top: 1.2rem;
}

.colset .col-inner > .image:first-child
{
	/* (line:24px * 1/4) 0 ((line:24px * 1/4) - 1px) */
	margin: 6px 0 5px;
	margin: .6rem 0 .5rem;
}

.colset .col-inner > .header-alt-a:first-child
{
	/* -(line:24px / 2) */
	margin-top: -12px;
	margin-top: -1.2rem;
}


/* Clear fix
****************************************************************/

.clear-wrapper { overflow: visible !important; }
.clear-left { clear: left; }
.clear-right { clear: right; }
.clear { clear: both; }