{
  margin: 0;
  padding: 0;
}

body { 
  background: url('') no-repeat center center fixed; 
  background-color: #f0f0f0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  margin: 10;
  padding: 10;
}

h1 {
  color: white;
  font-family: 'Open Sans',sans-serif;
  font-weight: 300;
  letter-spacing: 4px;
  margin: 4px;
  font-size: 300%;
  text-shadow: 2px 3px 4px #888;
}

h2 {
  color: white;
  font-family: 'Open Sans',sans-serif;
  font-weight: 300;
  letter-spacing: 4px;
  margin: 4px;
  font-size: 200%;
  text-shadow: 2px 3px 4px #888;
}

h3 {
  color: white;
  font-family: 'Open Sans',sans-serif;
  font-weight: 300;
  letter-spacing: 4px;
  margin: 4px;
  font-size: 100%;
  text-shadow: 2px 3px 4px #888;
}

.banner {
    background: rgba(0,100,150,0.8);
}

.page {
  background: url('') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

/* for arrangements of many topics on one page as a floating series of cards */

.topicthumb {
  background-color: #f0f0f0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 320px;
  height: 200px; 
  float: left;
  margin: 8px;
  box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
}

.topiclist {
  background-color: #f0f0f0;
  background: rgba(0.9,0.9,0.9,0.5);
  opacity: 0.6;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  margin: 4px;
}


/* for a detail on a single topic at full zoom with overlaid comments - currently size = any content image */

.topicdetail {
  position: relative;
}

/* overlaid commentary for a topic detail. similar to traditional text overlay on an image in powerpoint or keynote */

.topicdetailoverlay {
  position: absolute;
}

/* an overlaid image for a topic detail. could for example cover the entire backdrop of a topic detail */
.topicdetailimage {
  background-color: #f0f0f0;
  width: 100%;
}

.topicdetailnotes {
  color: black;
  font-family: 'Open Sans',sans-serif;
  font-weight: 400;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin:0px;
  width:100%;
  padding:2%;
  padding-right:0px; /* lovely that it is 2015 and browsers can't even center text with padding thanks tbl */
  display: block;
  background-color:white;
  opacity: 0.7;
}

a {
  color: white;
  text-decoration: none;
}