/*
 * Layout for the legacy Karma column-grid shortcodes ([one_half], [one_third],
 * [one_fourth], [one_fifth], [one_sixth], [two_thirds], [three_fourth] and
 * their _last variants, plus [flash_wrap]).
 *
 * Karma's original CSS used fixed pixel widths with separate overrides for
 * each of its old layout containers (boxed layout, footer, tabs, sliders,
 * gallery grids, specific page templates). None of those containers exist
 * in this theme, so this is a single responsive, percentage-based ruleset
 * instead - same float-based technique (required since these shortcodes
 * have no wrapping "row" element to apply flexbox to), just fluid.
 *
 * Column count -> width, assuming a 2% gutter between columns:
 *   width = (100% - (count - 1) * 2%) / count
 */

.tt-column {
	box-sizing: border-box;
	float: left;
	margin-right: 2%;
	margin-bottom: 20px;
}

.one_sixth_last,
.one_fifth_last,
.one_fourth_last,
.one_third_last,
.one_half_last,
.two_thirds_last,
.three_fourth_last {
	margin-right: 0;
}

.one_sixth,
.one_sixth_last {
	width: 15%;
}

.one_fifth,
.one_fifth_last {
	width: 18.4%;
}

.one_fourth,
.one_fourth_last {
	width: 23.5%;
}

.one_third,
.one_third_last {
	width: 32%;
}

.one_half,
.one_half_last {
	width: 49%;
}

.two_thirds,
.two_thirds_last {
	width: 66%;
}

.three_fourth,
.three_fourth_last {
	width: 74.5%;
}

.flash_wrap {
	min-height: 400px;
	height: auto;
}

/* Stack to full width on small screens, same behavior Karma used. */
@media only screen and (max-width: 767px) {
	.tt-column {
		float: none;
		width: 100% !important;
		margin: 0 0 20px 0;
	}
}