div.heading {
  color: #8ea;
  background: rgba(90,90,90,0.3);
  padding: .8em;
  border-radius: 12px;
  border-right: solid 2px #141; 
  border-bottom: solid 1px #141; 
  text-align: center;
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-variant: small-caps;
}

div.heading h1 {
  margin: 0;
}
div.heading h3 {
  margin: 0;
}

/* photo */
div.reference { float: left; }
div.content img {
  float: right; 
  border-radius: 12px;
  margin-left: 2em;
}

/* informational content */
div.content {
  border: groove rgba(128,128,128,0.5);
  border-radius: 8px;
  padding: 2em;
  margin-left: 17.5em;
  text-align: justify;
  font-size: 0.8em;
}
div.content a {
  color: #050;
}
div.content a:visited {
  color: #0a0;
}

/* contact information */
div.contact {
  clear: right;
  margin: 1em;
  padding-top: 1em;
  text-align: right;
  font-size: 0.8em;
}
div.contact span {
  font-style: italic;
}

/* social networks */
div.social {
  text-align: center;
  margin: 1em;
  margin-bottom: 0;
}
div.social a {
  text-decoration: none;
}
div.social a img {
  margin-left: 0.5em;
  border: none;
  -webkit-filter: drop-shadow(5px 5px 5px #222);
  filter: drop-shadow(5px 5px 5px #222);
}
div.social a img:last-child { display: none; }
div.social a:hover img:first-child { display: none; }
div.social a:hover img:last-child { display: inline; }

/* bio listings */
div.content span.head {
  font-weight: bold;
  font-size: 1.5em;
  color: #030;
}
div.bio span.subhead {
  font-weight: bold; 
}
div.bio span.emph {
  font-style: normal; 
  font-weight: bolder; 
  color: #050;
}
div.bio ul span {
  font-style: italic; 
}

/* TA classes */
div.content table {
  width: 100%;
  border-collapse: collapse;
}
div.content table tr {
  border: thin solid #333;
}
div.content table tr:nth-child(even) {
  background-color: rgba(0,0,0,0.2);
}
div.content table th {
  padding: 0.5em;
}
div.content table td {
  padding: 0.5em;
}

/* links section */
div.links {
  display: block;
  color: #080;
  width: 12.5em;
  margin-top: 1em;
  margin-bottom: 2em;
  background: none;
}
div.links ul:before {
  color: #363;
  font-variant: small-caps;
}
div.links ul {
  list-style: none;
  position: relative;
  width: 10em;
  text-align: center;
}
div.links li {
  background: rgba(150,190,150,0.3);
  border: 1px solid #8a8;
  margin: 0.5em;
  margin-left: -3em;
  color: #554b55;
  border-radius: 16px;
  box-shadow: 5px 5px 5px rgba(30,30,30,0.5);
}
div.links a {
  display: block;
  padding: 0.2em 1em;
  text-decoration: none;
  font-family: serif;
  font-variant: small-caps;
  color: inherit;
}
div.links li:hover {
  background: #8ea;
  color: #858;
}
div.links li:hover span
{
  display: inline;
  position: absolute;
  background: white;
  width: 24em;
  left: 100%;
  margin-top: -1.5em;
  padding: 0.5em 1em;
  border: thin solid black;
  border-radius: 0 12px 12px 12px;
  color: black;
  z-index: 1;
}
div.links ul span { display: none; }

/* page footer */
div.foot img { float: left; }
div.foot {
  text-align: right;
  margin-right: 1em;
  font-weight: lighter;
  font-size: smaller;
  color: #222;
}

/* background graphics */
body { margin: 1em 2em; padding: 1em; }
div.background {position:fixed; top: 0; left: 0; width:100%; height:100%;}
div.fullpagecontent {position:relative; z-index:1;}

/* canvas */
div.gfxcontent { position: relative; }
#overlay {
  position: absolute;
  left: 10px;
  top:  10px;
  color: #AAFFAA;
  text-shadow: 2px 2px 1px #000000;
  font-size: x-small;
}
