<commit_before>/*
	Chopstick frame
*/

.holder {
	@include padding-tb(1,0);
	background-color: #fff;
}

.row {
	@extend %clearfix;
	margin: 0 auto;
	max-width: 36em;
	@include px-padding-lr(.5,.5);

	.row {
		padding: 0;
	}

}

/*
	header
*/

.logo {
	font-family: $basefontserif;
	font-style: italic;
	font-weight: normal;
	@include font-dimensions(16,1,1);
}

.header .inner {
	border-bottom: 1px solid lighten($darkcolor,60);
	@extend %clearfix;
	@include padding-bottom(1);
}

.main-nav {
	@include list-nav;
	@include font-dimensions(16,1,0);
	font-family: $basefont;
	@extend %clearfix;

	a {
		color: lighten($darkcolor,50);
		text-decoration: none;
		font-weight: bold;
	}

	a:hover,
	.selected a {
		color: darken($primarycolor,0);
	}

}

/*
	doormat
*/

.doormat-holder {
	@include padding-bottom(1);
}

/*
	footer
*/

.footer-holder {
	background-color: $darkcolor;
	color: lighten($darkcolor,70);
	@include padding-top(1);
}



/* media queries
------------------------------------------ */

@media only screen and (min-width: $bp1) {

}

@media only screen and (min-width: $bp2) {

	.row {
		padding: 0;

		.row {
			@include px-margin-lr(-1,-1);
		}

	}

	.header,
	.footer,
	.doormat-col-4 {
		@include box-(12,1,1);
	}

}

@media only screen and (min-width: $bp3) {

	.logo {
		float: left;
		@include font-dimensions(14,1,0);
	}

	.main-nav {
		@include horizontal-nav();
		float: right;
		@include font-dimensions(14,1,0);

		li {
			@include px-margin-lr(1,0);
		}

	}

	.intro-holder {
		@include padding-top(2);
	}

}

@media only screen and (min-width: $bp4) {

	.holder {
		@include padding-tb(1,1);
	}

	.header-holder {
		@include padding-top(0);

		.inner {
			@include padding-tb(2,.5);
		}

	}

	.header {
		@include box-(12,1,1);
	}

	.row {
		max-width: #{$contextGridWidth}px;
	}

	.doormat-holder {
		@include padding-bottom(2);
	}

	.footer-holder {
		padding-bottom: 0;
	}

	.footer {
		@include box-(12,1,1);
	}

	.doormat-col-4 {
		@include box-(4,1,1);
	}
}

@media only screen and (min-width: $bp5) {

}<commit_msg>experimenting with the max-width in em<commit_after>/*
	Chopstick frame
*/

.holder {
	@include padding-tb(1,0);
	background-color: #fff;
}

.row {
	@extend %clearfix;
	margin: 0 auto;
	max-width: 36em;
	@include em-padding-lr(.5,.5);

	.row {
		padding: 0;
	}

}

/*
	header
*/

.logo {
	font-family: $basefontserif;
	font-style: italic;
	font-weight: normal;
	@include font-dimensions(16,1,1);
}

.header .inner {
	border-bottom: 1px solid lighten($darkcolor,60);
	@extend %clearfix;
	@include padding-bottom(1);
}

.main-nav {
	@include list-nav;
	@include font-dimensions(16,1,0);
	font-family: $basefont;
	@extend %clearfix;

	a {
		color: lighten($darkcolor,50);
		text-decoration: none;
		font-weight: bold;
	}

	a:hover,
	.selected a {
		color: darken($primarycolor,0);
	}

}

/*
	doormat
*/

.doormat-holder {
	@include padding-bottom(1);
}

/*
	footer
*/

.footer-holder {
	background-color: $darkcolor;
	color: lighten($darkcolor,70);
	@include padding-top(1);
}



/* media queries
------------------------------------------ */

@media only screen and (min-width: $bp1) {

}

@media only screen and (min-width: $bp2) {

	.row {
		padding: 0;

		.row {
			@include px-margin-lr(-1,-1);
		}

	}

	.header,
	.footer,
	.doormat-col-4 {
		@include box-(12,1,1);
	}

}

@media only screen and (min-width: $bp3) {

	.logo {
		float: left;
		@include font-dimensions(14,1,0);
	}

	.main-nav {
		@include horizontal-nav();
		float: right;
		@include font-dimensions(14,1,0);

		li {
			@include px-margin-lr(1,0);
		}

	}

	.intro-holder {
		@include padding-top(2);
	}

}

@media only screen and (min-width: $bp4) {

	.holder {
		@include padding-tb(1,1);
	}

	.row {
		max-width: #{$contextGridWidth}px;
		// max-width: $bp5; // this is not the same since we increase the font-size at certain breakpoints so the em-value increases too.
	}

	.header-holder {
		@include padding-top(0);

		.inner {
			@include padding-tb(2,.5);
		}

	}

	.header {
		@include box-(12,1,1);
	}

	.doormat-holder {
		@include padding-bottom(2);
	}

	.footer-holder {
		padding-bottom: 0;
	}

	.footer {
		@include box-(12,1,1);
	}

	.doormat-col-4 {
		@include box-(4,1,1);
	}
}
{'fraction_non_alphanumeric': 0.20161290322580644, 'fraction_numerical': 0.03320683111954459, 'mean_word_length': 2.805956678700361, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3158877', 'n_tokens_mistral': 1935, 'n_tokens_neox': 1781, 'n_words': 343}