body {
	font-family: "PT Serif",Georgia,serif; 
	font-size: 1.25em;
	line-height: 1.6;
	color: #333;
	padding: 0;
	margin: 0;
	background: #fff;
}
.container {
	max-width: 800px;
	margin: 0 auto;
}

h1 {
	font-size:2.5em;
}

h2 {
	font-size: 2.5em;
}

h1,h2,h3,h4,h5,h6,h7 {
	line-height:1.4em;
	font-weight: normal;
	margin: 1.4rem 0;
}

p {
	margin: 1.6rem 0;
}

pre{
	padding:10px;
	background:#eee;
	overflow-x:auto;
}

/* Navbar */

nav {
	margin: 0;
	padding: 0;
}

ul.navbar-nav {
	list-style-type: none;
	margin: .5em 0;
	padding: 0;
} 
li.nav-item {
	display: inline;
	margin-right: 0.5em;
	vertical-align: middle;
}
li.navbar-brand {
}

/* Jumbotron and Footer */

.jumbotron, footer {
	background: #333;
	color: #fff;
	padding: 1rem 0;
}

footer {
	box-shadow: 0 50vh 0 50vh #333; /* stolen from https://stackoverflow.com/questions/9741701/how-can-i-extend-a-footer-to-bottom-of-page */
}

/* Links */

a, a:visited {
  color:#333;
	text-decoration: underline;
	text-decoration-style: solid;
}

a:hover {
	text-decoration: underline;
	text-decoration-style:dotted;
	color: #777;
}

a:active{
	text-decoration: none;
	background: #333;
	color: #fff;

}

.jumbotron a, footer a, .jumbotron a:visited, footer a:visited {

  color:#fff;
	text-decoration: underline;
	text-decoration-style: solid;
}

.jumbotron a:hover, footer a:hover {
	text-decoration: underline;
	text-decoration-style:dotted;
  color: #ccc;
}
.jumbotron a:active, footer a:active{
	color: #000;
	text-decoration: none;
	background-color: #fff;
}



/* Blog specific */

.post-date {
	font-style: italic;
}

a.footnote, a.footnote:visited {
	margin: 0 0.1em;
	background: #333;
	color: #fff;
	font-weight: bold;
	border: none;
	padding:0 .5em;
	border-radius: 50px;
	font-family: "Fira Sans", Helvetica, sans-serif;
	text-decoration: none;
}

a.footnote:hover {
	background: #666;
	text-decoration: none;
}

a.footnote:active {
	background: #ddd;
	color : #333;
}

sup{ /* fix line height break */
	vertical-align: top;
	font-size: .5em;
	position: inline;

} 

article img {
	max-width: 100%;
	height: auto;
}

.footnotes li p {
	margin:0;
}


.footnotes li {
	margin-top: .5em;
	margin-bottom: .5em;
}

.footnotes li:target {
	border-top:dotted #333 .5em;
	border-bottom: dotted #333 .5em;
	border-right: dotted #333 .5em;
	padding-top: .5em;
	padding-bottom: .5em;
}

/* Mbrane specific */

table{
	font-size:.8em;
	border-collapse: collapse;
}

table td, table th {
	padding: 3px;
	border-left: 1px solid #333;
	border-right:1px solid #333;
	
}

table.mbrane-table th, table.mbrane-table td {
	border: solid 2px #888;
	min-width: 30px;
	height: 30px; /* for tables height is the same as min height */
	background: #fafaff;
	padding: 0.2em;
}

table.mbrane-table th {
	font-weight: normal;
}

table.mbrane-table{
	margin: 10px 0;
	text-align: center;
	border-collapse: collapse;
	font-size: 1em;
	
}

table.mbrane-board-table tbody:nth-child(3) td, table.mbrane-board-table tbody:nth-child(4) td,
table.mbrane-board-table tbody:nth-child(6) td, table.mbrane-board-table tbody:nth-child(7) td {
	background: #e5eeff;
}

table.mbrane-board-table td:nth-child(3), table.mbrane-board-table th:nth-child(3),
table.mbrane-board-table td:nth-child(4), table.mbrane-board-table th:nth-child(4),
table.mbrane-board-table td:nth-child(6), table.mbrane-board-table th:nth-child(6),
table.mbrane-board-table td:nth-child(7), table.mbrane-board-table th:nth-child(7){
	background: #e5eeff;
}

table.mbrane-board-table tbody:nth-child(3) td:nth-child(3),
table.mbrane-board-table tbody:nth-child(3) td:nth-child(4),
table.mbrane-board-table tbody:nth-child(3) td:nth-child(6), 
table.mbrane-board-table tbody:nth-child(3) td:nth-child(7),
table.mbrane-board-table tbody:nth-child(4) td:nth-child(3),
table.mbrane-board-table tbody:nth-child(4) td:nth-child(4),
table.mbrane-board-table tbody:nth-child(4) td:nth-child(6), 
table.mbrane-board-table tbody:nth-child(4) td:nth-child(7),
table.mbrane-board-table tbody:nth-child(6) td:nth-child(3),
table.mbrane-board-table tbody:nth-child(6) td:nth-child(4),
table.mbrane-board-table tbody:nth-child(6) td:nth-child(6), 
table.mbrane-board-table tbody:nth-child(6) td:nth-child(7),
table.mbrane-board-table tbody:nth-child(7) td:nth-child(3),
table.mbrane-board-table tbody:nth-child(7) td:nth-child(4),
table.mbrane-board-table tbody:nth-child(7) td:nth-child(6), 
table.mbrane-board-table tbody:nth-child(7) td:nth-child(7){
	background: #ccddff;
}

/* table borders identifying regions */

table.mbrane-board-table tbody:nth-child(3) td, table.mbrane-board-table tbody:nth-child(6) td,
table.mbrane-board-table tbody:nth-child(9) td{
	border-bottom: solid 3px #000;
}

table.mbrane-board-table thead th{
	border-top: solid 3px #000;
}

table.mbrane-board-table td:nth-child(3), table.mbrane-board-table th:nth-child(3),
table.mbrane-board-table td:nth-child(6), table.mbrane-board-table th:nth-child(6),
table.mbrane-board-table td:nth-child(9), table.mbrane-board-table th:nth-child(9){
	border-right: solid 3px #000;
}

table.mbrane-board-table td:nth-child(1), table.mbrane-board-table th:nth-child(1) {
	border-left: solid 3px #000;
}

table.mbrane-score-table td,  table.mbrane-score-table th{
	border: solid 3px #000;
	background: #e5eeff;
}

/* Make experience immersive when user highlights text */

::selection {
	color: #fff;
	background: #000;
}
.jumbotron ::selection, .footer ::selection {
	color: #000;
	background: #fff;
} 

sup[id*=fnref] ::selection {
	background: #fff;
	color: #000;
}

/* Responsive */


@media  only screen and (max-width: 820px) {
	.container {
		margin: 1.5em;
	}
	body {
		font-size: 1em;
		line-height: 1.5em;
	}

	sup {
		font-size:.7em;
		vertical-align:top;
		
	}
	a.footnote {
		padding:0 .3em;
	}
}

@media only screen and (max-width: 600px) {
	li.nav-item {
		display: block;
		margin:0;
		margin:.5em 0;
	}
}

/* Print stylesheet */


@media print {
	footer {
		box-shadow: none;
	}

}