// специфичные замены под разные шаблоны вывода type_foreach-файлов

$SCREEN_TABLET:  "(max-width: 768px)" !default;
$SCREEN_PHONE:   "(max-width: 667px)" !default;

// две колонки
.mso-tf-full-2col,
.mso-tf-full-3col,
.mso-tf-full-4col, 
.mso-tf-full-5col, 
.mso-tf-full-6col,
.mso-tf-full-7col,
.mso-tf-full-8col
{
	display        : flex;
    justify-content: space-between;
    align-items    : stretch;
	flex-wrap: wrap;
	
	div.mso-page-only {
		width: 47%;
		margin: 5px 0 40px 0;
		
		// это нужно, чтобы прижать нижний блок READ к низу
		article {
		 	position: relative; 
		 	height: 100%;
		}
	}

	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 100%;
		}
	}
}

// три колонки
.mso-tf-full-3col {
	div.mso-page-only {
		width: 31%;
	}
	
	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 23%;
		}
	}
	
	@media #{$SCREEN_PHONE}  {
		div.mso-page-only {
			width: 47%;
		}
	}
}

// четыре колонки
.mso-tf-full-4col {
	div.mso-page-only {
		width: 23%;
	}
	
	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 23%;
		}
	}
	
	@media #{$SCREEN_PHONE}  {
		div.mso-page-only {
			width: 47%;
		}
	}
}

// 5 колонок
.mso-tf-full-5col {
	div.mso-page-only {
		width: 18%;
	}
	
	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 23%;
		}
	}
	
	@media #{$SCREEN_PHONE}  {
		div.mso-page-only {
			width: 47%;
		}
	}
}

// 6 колонок
.mso-tf-full-6col {
	div.mso-page-only {
		width: 15%;
	}
	
	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 23%;
		}
	}
	
	@media #{$SCREEN_PHONE}  {
		div.mso-page-only {
			width: 47%;
		}
	}
}

// 7 колонок
.mso-tf-full-7col {
	div.mso-page-only {
		width: 13%;
	}
	
	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 23%;
		}
	}
	
	@media #{$SCREEN_PHONE}  {
		div.mso-page-only {
			width: 47%;
		}
	}
}

// 8 колонок
.mso-tf-full-8col {
	div.mso-page-only {
		width: 12%;
	}
	
	@media #{$SCREEN_TABLET}  {
		div.mso-page-only {
			width: 23%;
		}
	}
	
	@media #{$SCREEN_PHONE}  {
		div.mso-page-only {
			width: 47%;
		}
	}
}

