$web-tables: true !default;
@if $web-tables {

	// Tables
	 
	table {
		border-collapse: collapse;
		margin: $line-height-default 0;
		font-size: $font-size-default * $font-size-smaller;
		width: 100%;
		// Scroll if necessary (e.g. narrow screens)
		@media (max-width: $break-width-small) {
			display: block; // required for overflow-x: auto to work
			overflow-x: auto;
		}
		// Do the same if JS has added a responsive-table class
		&.scrolling-table {
			display: block; // required for overflow-x: auto to work
			overflow-x: auto;
		}
	}

	thead, th {
		page-break-after: avoid;
		font-weight: bold;
	}
	th, td {
		border: $rule-thickness solid $color-mid;
		padding: $line-height-default * 0.5;
		p, ol, ul {
			list-style-position: outside;
			margin: 0;
			padding: 0;

			ol, ul {
				margin-left: 1em;
			}
		}
		ol, ul {
			list-style-position: inside;
		}
	}
	.table-row-stub {
		font-weight: bold;
	}
	.table-caption {
		page-break-after:avoid;
		font-style: italic;
		text-indent: 0;
		margin: $line-height-default 0 0 0;
		& em {
			font-style: normal;
		}
	}

}
