.toc {
	background-color: #efefef;
	padding: $guaranteed-edge-standoff $guaranteed-edge-standoff;

	&:after {
		clear: both;
		content: '';
		display: block;
	}

	.col {
		border-top: 1px solid darken(#efefef, 5%);
		margin: 0;
		word-break: break-word;

		&:first-child {
			border-top: none;
		}

		@include breakpoint($breakpoint-bravo) {
			border-right: 1px solid darken(#efefef, 5%);
			float: left;
			padding-right: 2%;
			vertical-align: top;
			width: 50%;

			&:nth-child(2n+1) {
				border-left: 1px solid darken(#efefef, 5%);
				border-right: none;
				left: -1px; /* middle border overlap */
				margin-right: 0;
				padding-left: 2%;
				position: relative;
			}

			&:nth-of-type(2n+3){
				clear: left;
			}
		}

		@include breakpoint($breakpoint-charlie) {
			border-right: none;
			width: 24%;

			/** reset from breakpoint-alpha **/
			&:nth-of-type(2n+3) {
				clear: none;
			}

			&:nth-of-type(5n) {
				clear: left;
			}

			&:nth-child(2n+1) {
				border-left: none;
			}

			&:nth-of-type(9n) {
				clear: left;
			}

			&:last-child {
				clear: right;
			}

		}

	}

	h2 {
		margin: 0 0 1em;
	}

	ul {
		margin-top: .5em;
		padding-left: 0;
	}

	a {
		background-image: none;
		border: 0;
		color: $almost-black;
		display: inline-block;
		text-decoration: underline;

		&:focus,
		&:hover {
			text-decoration: none;
		}

	}

	h3 {
		@extend %caps-text;

		font-size: 1.2em;
		font-weight: 600;
		margin-bottom: 0;

		a {
			text-decoration: none;

			&:hover,
			&:focus {
				text-decoration: underline;
			}

		}

	}

	li {
		list-style-type: none;
	}
}
