@import url(http://fonts.googleapis.com/css?family=Roboto|Droid+Sans|Droid+Serif);
body {
	font-family: 'Roboto', 'Calibri', 'Tahoma', sans-serif;
}

#contentwrapper{
	height: 100vh;
	min-height:570px;
}

#contentcolumn{
	margin-left: 230px; /*Set left margin to LeftColumnWidth*/
	border-left-style: solid;
	border-width: 1px;
	border-color: #E0E0E0;
	background-color: white;
	overflow-y: scroll;
}

#leftcolumn{
	float: left;
	width: 220px; /*Width of left column*/
	margin-left: -100%;
	background: white;
}

#thecontent{
	padding-top: 80px;
	-webkit-columns: 700px 4;
	-moz-columns: 700px 4;	
	columns: 700px 4;	
	-webkit-column-rule: 1px solid #E0E0E0;
	-moz-column-rule: 1px solid #E0E0E0;
	column-rule: 1px solid #E0E0E0;
}

nav p{
	margin-top: 12px;
	margin-bottom: 12px;
}

nav a{
	background-color:white;
	color:#9C27B0;
	font-weight: bolder;
	text-decoration: none;
	border-radius:10px;
	border-color: black;
	border-style: solid;
	border-width: 1px;
	padding: 5px;
	text-align:center;
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.5);
	display: table-cell;
	width: 200px;
	transition: transform 0.2s ease;
}

nav img {
	vertical-align: middle;
}

nav a:hover, nav a:focus{
   transition-delay: 0s;
   background-color:white;
   transform: scale(1.08);
   color: #00BCD4;
}

#header {
	height: 75px;
   padding-top: 5px;
   background-color: rgba(245,245,245,0.92);
   color:black;
   width: calc(100% - 250px);
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
   position: fixed;
   -webkit-backdrop-filter: blur(5px);
   -moz-backdrop-filter: blur(5px);
   backdrop-filter: blur(5px);
}

#fixed_index {
   padding: 10px;
   border-radius: 5px;
   background-color: rgba(245,245,245,0.92);
   color:black;
   top: 95px;
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
   position: fixed;
   -webkit-backdrop-filter: blur(5px);
   -moz-backdrop-filter: blur(5px);
   backdrop-filter: blur(5px);	
}

#header a {
	color: #9C27B0;
	transition: color 0.2s ease;
}

#header a:hover{
	color: #00BCD4;
}

#thecontent a {
	color: #9c27b0;
	text-decoration:underline;
   transition: color 0.2s ease;	
}

#thecontent a:hover {
	color:#00BCD4;
}

#thecontent :target {
	color: #00BCD4;
}

#thecontent table {
	border-style: none;
	margin-bottom: 1em;
	box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.26);
}

fmath table {
	box-shadow: none !important;
}

#thecontent p.announcement {
	color: #B22222;
	box-shadow: 0 12px 15px 0 rgba(178, 34, 34, 0.26);	
	margin: 2em;
	padding: 1em;
	border: 2px;
	border-style: solid;
	border-color: #B22222;
}

figure img, img.right, img.left, figure video {
   box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.26);   
}

#logonav {
	height: 75px;
	width: 100%;
	padding:5px;
	margin-right:10px;
	border-bottom-style:solid;
	border-width:1px;
	border-color:#E0E0E0;
}

#bottom {
	font-size: 80%;
	border-top-style: solid;
	border-width: 1px;
	border-color:#E0E0E0;
	position:absolute;
	bottom: 0px;
	width: 220px;
	padding: 5px;
	background-color: white;
	-webkit-column-count: 2;
   -moz-column-count: 2;	
   column-count: 2;	
}

#thecontent h1:before, #thecontent h2:before, #thecontent h3:before, #thecontent figure:before { 
  display: block; 
  content: " "; 
  margin-top: -90px; 
  height: 90px; 
  visibility: hidden; 
}