// MaxSite CMS
// Copyright http://max-3000.com/
// @import url('mixins/columns.less');

// колонки 
div.columns {
	@col_padding: 30px; // растояние между колонками
	
	margin-right: -@col_padding;
	
	// контент колонки
	div.column-content {
		overflow: hidden;
		margin-right: @col_padding;
		margin-bottom: 20px;
	}
}

// box модель - аля-таблица
div.box {
	display: table;
	width: 100%;
	border-collapse: collapse;
	
	div.row {
		display: table-row;
		
		div.cell {
			display: table-cell;
			vertical-align: top;
		}
	}
}

// расчет ширины колонки с учетом промежутка 
// .col_w(2, 5, 3%); // 2 из 5-ти колонок с 3% промежутком
.col_w(@n, @all, @s: 3%)
{
	width: ( ( (100% - ((@all - 1) * @s)) / @all ) * @n) + (@n - 1) * @s;
}

// вспомогательный микс для стилей колонок
._col(@s: 3%) 
{
	float: left;
	margin-left: @s;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	&:first-of-type {
		margin-left: 0;
	}
}

// готовый микс
// @n — колонок 
// @all — всего колонок
// @s: 3% — промежуток
.column_width(@n, @all, @s: 3%)
{
	._col(@s);
	.col_w(@n, @all, @s);
}

// колоночная верстка с 3% отступом — готовые стили для 8-ми колонок
// http://wbloger.com/uploads/screenshot/screen-2013-01-20-52-000.png
div.onerow {

	.col 
	{
		float: left;
		margin-left: 3%;
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
		// .border();
		// .align(center);
		
		img.thumb {
			width: 100%;
		}
	}
	
	.col:first-of-type {
		margin-left: 0;
	}
	
	.w1-1 {
		width: 100%;
	}
	
	.w1-2 {
		.col_w(1, 2, 3%);
	}
	
	.w1-3 {
		.col_w(1, 3, 3%);
	}
	
	.w2-3 {
		.col_w(2, 3, 3%);
	}	
	
	.w1-4 {
		.col_w(1, 4, 3%);
	}
	
	.w2-4 {
		.col_w(2, 4, 3%);
	}
	
	.w3-4 {
		.col_w(3, 4, 3%);
	}
	
	.w1-5 {
		.col_w(1, 5, 3%);
	}
	
	.w2-5 {
		.col_w(2, 5, 3%);
	}
	
	.w3-5 {
		.col_w(3, 5, 3%);
	}
	
	.w4-5 {
		.col_w(4, 5, 3%);
	}
	
	.w1-6 {
		.col_w(1, 6, 3%);
	}
	
	.w2-6 {
		.col_w(2, 6, 3%);
	}
	
	.w3-6 {
		.col_w(3, 6, 3%);
	}
	
	.w4-6 {
		.col_w(4, 6, 3%);
	}
	
	.w5-6 {
		.col_w(5, 6, 3%);
	}

	.w1-7 {
		.col_w(1, 7, 3%);
	}
	
	.w2-7 {
		.col_w(2, 7, 3%);
	}
	
	.w3-7 {
		.col_w(3, 7, 3%);
	}
	
	.w4-7 {
		.col_w(4, 7, 3%);
	}
	
	.w5-7 {
		.col_w(5, 7, 3%);
	}
	
	.w6-7 {
		.col_w(6, 7, 3%);
	}
	
	.w1-8 {
		.col_w(1, 8, 3%);
	}
	
	.w2-8 {
		.col_w(2, 8, 3%);
	}
	
	.w3-8 {
		.col_w(3, 8, 3%);
	}
	
	.w4-8 {
		.col_w(4, 8, 3%);
	}
	
	.w5-8 {
		.col_w(5, 8, 3%);
	}
	
	.w6-8 {
		.col_w(6, 8, 3%);
	}
	
	.w7-8 {
		.col_w(7, 8, 3%);
	}
	
}


