/* elixir journal css */
/* ------------------ */

/* Specifically for caption under top photo in Issue 15 Shower of Bullets: img-with-text33L */

/* elements */

body {
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
/*  background-color: #D0D0D0; */
  margin: 0px; /* because browser puts in extra margin if unspecified. */
  margin-left: 5%;
  margin-right: 5%;
  font-family: "Arial";
  font-size: 16px; /* child elements can use %ages of this */
}

    /* separator between div sections, used on pretty much every page */
div.separator {
  /*background-color: white;
  border-radius: 7px;*/
  clear: both;
  color: black;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  /*padding: 5px;*/
  text-align: center;
}

  /* h1.mast is for the masthead, aka Elixir logo at the top of every page 
    404.shtml
	include_mast.htm 
	index.php
  */
h1.mast {
  background-color: white;
  border-radius: 7px;
  color: black;
  font-family: "Century Gothic";
  font-size: 18px;
  margin-bottom: 10px;
  margin-top: 10px;
  text-align: center;
  
/*  freeze header effect (needs experimentation) 
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px; */

}

  /* span.mast used inside h1.mast to render e*lix*ir in 4x bold
    404.shtml
	include_mast.htm
  */ 
span.mast {
  font-size: 400%;
  font-weight: bold;
}

  /* The mission used inside h1.mast on home page only */
div.mission {
  font-size: 18px;
  padding: 20px;
  padding-top: 0px;
  text-align: left;
}

  /* h2.nav and ul stuff is for the top horizontal navigation bar */
h2.nav {
/*  background-color: white; */
  /*border-radius: 7px;*/
  color: black;
  /*font-family: "Lucida Calligraphy", "Monotype Corsiva";*/
  /*font-family: "Bookman Old Style", "Century Schoolbook", "Georgia", "Verdana";*/
  /*font-family: "Century Gothic";*/
  font-size: 75%;
  margin: 0px;
  margin-bottom: 10px;
  opacity: 1.0;
/*  padding: 5px;*/
  text-align: center;
}

h2 ul {
  text-align: center;
  display: inline;
  margin: 0px;
  /*padding: 0px;*/
/*  padding: 15px 4px 17px 0;*/
  list-style: none;
}

h2 ul li {
  background: #fff;
  border: 1px solid black;
  border-radius: 7px;
  cursor: pointer;
  display: inline-block;
/*  font: bold 12px/18px sans-serif;*/
  margin-right: 10px;
  padding: 5px 7px; 
  position: relative;
}
/*
h2 ul li {
  background: #fff;
  border: 1px solid black;
  border-radius: 7px;
  cursor: pointer;
  display: inline-block;
  margin-right: 25px;
  padding: 10px 10px; 
  position: relative;
}
*/

h2 ul li:hover {
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
}

h2 ul li a:link {
  color: black;
  text-decoration: none;
}

h2 ul li a:visited {
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
  color: black;
  text-decoration: none;
}

h2 ul li a:hover {
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
  color: black;
}

h2 ul li ul {
  left: 0px;
  padding: 0px;
  position: absolute;
/*  top: 48px; */
/*  width: 150px; */
  display: none;
  opacity: 0;
  visibility: hidden;
}

h2 ul li ul li { 
/*  background-image: none; */
  background-color: #C8C8C8;
  border: 1px solid black;
  display: block; 
  font-size: 100%;
/*  color: #fff;*/
/*  text-shadow: 0 -1px 0 #000;*/
}

h2 ul li ul li:hover { 
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
}

h2 ul li:hover ul {
  display: block;
  opacity: 1; 
  visibility: visible; 
}

h2 ul li ul li a:link {
  color: black;
  text-decoration: none;
}

h2 ul li ul li a:visited {
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
  color: black;
  text-decoration: none;
}

h2 ul li ul li a:hover {
/*  background-image: url("img/parchment.jpg"); */
  background-color: #C8C8C8;
  color: black;
}
  /* end of horizontal navigation bar stuff */

  /* main body related css */

    /* feature classes - for home page feature (not used in issue 2 due to multi-languages) */
div.feature {
  background-color: white;
  border: none;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 100%;
  float: left;
}

div.feature h1 {
  color: black;
  font-size: 160%;
  top-margin: 10px;
  bottom-margin: 10px;
  left-margin: 0px;
  right-margin: 0px;
/*  padding: 5px;*/
  text-align: center;
}

div.feature h2 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: center;
}

div.feature h3 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: left;
}

div.feature p {
  color: black;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
  height: 150px;
  overflow: scroll;  
}

div.feature img {
/*  border: 5px solid white; */
  float: left;
  height: 175px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}


div.feature_long {
  background-color: white;
  border: none;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 100%;
  float: left;
}

div.feature_long h1 {
  color: black;
  font-size: 160%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 0px;
/*  padding: 5px;*/
  text-align: center;
}

div.feature_long h2 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: center;
}

div.feature_long h3 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: left;
}

div.feature_long p {
  color: black;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
  height: 207px;
  overflow: scroll;  
}

div.feature_long img {
/*  border: 5px solid white; */
  float: left;
  height: 240px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}

/* issue8  - doubled the height of p and img from feature_long */
 
 div.feature_long8 {
  background-color: white;
  border: none;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 100%;
  float: left;
}

div.feature_long8 h1 {
  color: black;
  font-size: 160%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 0px;
/*  padding: 5px;*/
  text-align: center;
}

div.feature_long8 h2 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: center;
}

div.feature_long8 h3 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: left;
}

div.feature_long8 p {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
  height: 327px;
  overflow: scroll;  
}

div.feature_long8 img {
/*  border: 5px solid white; */
  float: left;
  height: 360px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}
/* issue4 */
#bigfeatureimg img {
  float: left;
  height: 340px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}

#bigfeatureimg p {
  color: black;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
  height: 340px;
  overflow: scroll;  
}


    /* overview page classes */
div.overview_editorial {
  background-color: white;
  border: None;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 100%;
  float: left;
}

div.overview_editorial h1 {
  color: black;
  font-size: 160%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 0px;
/*  padding: 5px;*/
  text-align: center;
}

div.overview_editorial h2 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: center;
}

div.overview_editorial h3 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: left;
}

div.overview_editorial p {
  color: black;
  font-size: 100%;
  line-height: 135%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
  height: 327px;
  overflow: scroll;  
}

div.overview_editorial img {
/*  border: 5px solid white; */
  float: left;
  height: 360px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}

div.overview_items_container {
  background-color: white;
  border: none;
  border-radius: 7px;
  display: inline-block;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  text-align: center;
  width: 100%;
}

div.overview_gutter {
  display: inline-block;
  width: 4%;
  float: left;
  text-align: center;
}


div.overview_item_3 {
  background-color: white;
  border: None;
  border-radius: 7px;
  display: inline-block;
  width: 30%;
  float: left;
  text-align: center;
}

div.overview_item_3 h1 {
  color: black;
  font-size: 160%;
  margin-top: 15px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 0px;
/*  padding: 5px;*/
  text-align: center;
}

div.overview_item_3 h3 {
  color: black;
  font-size: 120%;
  margin-top: 12px;
  margin-bottom: 6px;
  margin-left: 0px;
  margin-right: 0px;
/*  padding: 5px;*/
  text-align: center;
}

div.overview_item_3 img {
  width: 90%;
}

div.overview_item_3 p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 125%;
  margin-top: 2px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.overview_toc {
  background-color: white;
  border: None;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  text-align: center;
  width: 100%;
}

/* No h1 */

div.overview_toc h2 {
  color: black;
  font-size: 120%;
  font-weight: normal;
  text-align: center;
}

  /* issue_cover "Table of Contents" */
div.overview_toc h3 {
  font-size: 160%;
  margin-left: 5px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

  /* Section, e.g. Editorial, Poetry, etc. */
div.overview_toc h4 {
  font-size: 150%;
  font-weight: bold;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.overview_toc h5 {
  font-size: 110%;
  font-weight: normal;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.overview_toc h6 {
  font-size: 90%;
  font-weight: normal;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.overview_toc h5 a:link {
  color: darkblue;
  text-decoration: none;
}

div.overview_toc h5 a:hover {
  background-color: blue;
  color: white;
  padding: 2px;
  text-decoration: none;
}

/*
div.overview_toc h5 a:visited {
  background-color: white;
  color: darkblue;
  text-decoration: none;
}
*/

div.overview_toc h6 a:link {
  color: darkgreen;
  text-decoration: none;
}

div.overview_toc h6 a:hover {
  background-color: darkgreen;
  color: white;
  padding: 2px;
  text-decoration: none;
}

/*
div.overview_toc h6 a:visited {
  background-color: white;
  color: darkgreen;
  text-decoration: none;
}
*/

div.overview_toc_left {
  background-color: white;
  border: 2px solid black;
  border-radius: 7px;
  display: inline-block;
  width: 30%;
  float: left;
  padding: 5px;
  text-align: center;
}

/* No h1 */

div.overview_toc_left h2 {
  color: black;
  font-size: 120%;
  font-weight: normal;
  text-align: center;
}

  /* issue_cover "Table of Contents" */
div.overview_toc_left h3 {
  font-size: 160%;
  margin-left: 5px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

  /* Section, e.g. Editorial, Poetry, etc. */
div.overview_toc_left h4 {
  font-size: 150%;
  font-weight: bold;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.overview_toc_left h5 {
  font-size: 110%;
  font-weight: normal;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.overview_toc_left h6 {
  font-size: 90%;
  font-weight: normal;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.overview_toc_left h5 a:link {
  color: darkblue;
  text-decoration: none;
}

div.overview_toc_left h5 a:hover {
  background-color: blue;
  color: white;
  padding: 2px;
  text-decoration: none;
}

/*
div.overview_toc_left h5 a:visited {
  background-color: white;
  color: darkblue;
  text-decoration: none;
}
*/

div.overview_toc_left h6 a:link {
  color: darkgreen;
  text-decoration: none;
}

div.overview_toc_left h6 a:hover {
  background-color: darkgreen;
  color: white;
  padding: 2px;
  text-decoration: none;
}

/*
div.overview_toc_left h6 a:visited {
  background-color: white;
  color: darkgreen;
  text-decoration: none;
}
*/


div.random_praise {
  background-color: palegoldenrod;
  border: none;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 100%;
  float: left;
}
div.random_praise h1 {
  color: black;
  font-size: 130%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10%;
  margin-right: 0px;
  padding: 5px;
  text-align: left;
}
div.random_praise p {
  color: black;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10%;
  margin-right: 10%;
  padding: 5px;
  text-align: left;
}
div.random_praise h3 {
  color: black;
  font-size: 100%;
  font-weight: normal;
  margin: 10px;
  margin-left: 10%;
  padding: 5px;
  text-align: left;
}

    /* subfeature classes  on home page underneath the feature */

/*div.subfeaturecontainer {
  background-color: white;
  border: none;
  border-radius: 7px;
  /*display: inline;*/
  /*width: 100%;  */
/*}*/

div.subfeaturecontainer {
  background-color: white;
  border-radius: 7px;
  color: black;
  display: inline-block;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  text-align: left;
  width: 100%;
}

div.subfeaturecontainer h1 {
  font-size: 160%;
  margin: 10px;
  text-align: center;
}

div.subfeaturecontainer h2 {
  color: black;
  font-size: 120%;
  margin: 10px;
  text-align: center;
}

div.subfeaturecontainer h3 {
  color: black;
  font-size: 100%;
  margin: 10px;
  text-align: center;
}

div.subfeaturecontainer h6 {
  color: black;
  font-size: 80%;
  margin: 10px;
  text-align: center;
}

/* first used in issue 6 */
div.subfeaturecontainer h5 {
  color: black;
  display: inline-block;
  font-size: 100%;
  font-weight: normal;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10%;
  margin-right: 10%;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

/* first used in issue 6 */
div.subfeaturecontainer img {
  border: none;
  margin: auto;
  width: 80%;
}

div.subfeature {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature h2 {
  color: black;
  display: inline-block;
  font-size: 160%;
  margin: 10px;
  text-align: center;
}

div.subfeature h2 a:link {
  color: blue;
}

div.subfeature h2 a:visited {
  color: purple;
}

div.subfeature h2 a:hover {
  background-color: blue;
  color: white;
}

div.subfeature h3 {
  color: black;
  display: inline-block;
  font-size: 120%;
  margin: 10px;
  text-align: center;
}

div.subfeature p {
  color: black;
  display: inline-block;
  font-size: 100%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature img {
/*  border: 5px solid white; */
  display: inline-block;
  text-align: center;
  /*float: left;*/
  height: 150px;
  margin: 10px;
  max-width: 90%;
/*  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;*/
  /*width: 100%;*/
}

/* homepagecontainer first used in Issue 8 for paintings */
div.homepagepaintingscontainer {
  background-color: white;
  border-radius: 7px;
  color: black;
  display: inline-block;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  text-align: left;
  width: 100%;
}

div.homepagepaintingscontainer h1 {
  font-size: 120%;
  margin: 10px;
  text-align: center;
}

div.homepagepaintingscontainer h3 {
  color: black;
  font-size: 100%;
  margin: 10px;
  text-align: center;
}

div.homepagepaintingscontainer img {
  border: none;
  margin: auto;
  width: 62%;
}


/*for praises, same as h2, but color=blue instead of black */
div.subfeature h4 {
  color: blue;
  display: inline-block;
  font-size: 160%;
  margin: 10px;
  text-align: center;
}


div.subfeature_long {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature_long h2 {
  color: black;
  display: inline-block;
  font-size: 160%;
  margin: 10px;
  text-align: center;
}

div.subfeature_long h2 a:link {
  color: blue;
}

div.subfeature_long h2 a:visited {
  color: purple;
}

div.subfeature_long h2 a:hover {
  background-color: blue;
  color: white;
}

div.subfeature_long h3 {
  color: black;
  display: inline-block;
  font-size: 120%;
  margin: 10px;
  text-align: center;
}

div.subfeature_long p {
  color: black;
  display: inline-block;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature_long img {
/*  border: 5px solid white; */
  display: inline-block;
  text-align: center;
  /*float: left;*/
  height: 200px;
  margin: 10px;
  max-width: 90%;
/*  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;*/
  /*width: 100%;*/
}

/*for praises, same as h2, but color=blue instead of black */
div.subfeature_long h4 {
  color: blue;
  display: inline-block;
  font-size: 160%;
  margin: 10px;
  text-align: center;
}


span.excerpts {
  font-size: 50%;
}

div.subfeatureartcontainer {
  display: inline-block;
  font-size: 100%;
  text-align: center;
  width: 100%;
}

div.subfeatureart {
  color: black;
  display: inline-block;
  font-size: 100%;
  line-height: 150%;
  margin-left: 30px;
  margin-right: 30px;
  /*padding: 5px;
  padding-right: 20px;*/
  text-align: center;
}


div.subfeatureart img {
/*  border: 5px solid white; */
  display: inline-block;
  text-align: center;
  /*float: left;*/
  height: 300px;
  /*margin: 10px;*/
  max-width: 90%;
/*  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;*/
  /*width: 100%;*/
}

/* For issue 6 cover only, because I can't set the height to pixels with a relative width */
div.subfeature6a {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature6a img {
  width: 67%;
}

div.subfeature6a p {
  color: black;
  display: inline-block;
  font-size: 100%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature6b {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature6b img {
  width: 80%;
}

div.subfeature6b p {
  color: black;
  display: inline-block;
  font-size: 100%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

/* div.feature7narrow stuff for issue 7 cover  */
div.feature7narrow {
  background-color: white;
  border: none;
  border-radius: 7px;
/*  margin-left: 0px;
  margin-right: 0px; */
  margin-left: 12%;
  margin-right: 12%; 
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 76%; 
/*  width: 100%; */
  float: center;
}

div.feature7narrow_left_filler {
  display: inline-block;
  width: 23%;
  float: left;
  text-align: center;
}

div.feature7narrow h1 {
  color: black;
  font-size: 160%;
  top-margin: 10px;
  bottom-margin: 10px;
  left-margin: 12%;
  right-margin: 12%;
/*  padding: 5px;*/
  text-align: center;
}

div.feature7narrow h3 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: left;
}

div.feature7narrow p {
  color: black;
/*  font-size: 100%; */
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  /*padding-right: 20px;*/
  text-align: left;
  height: 200px;
/*  height: 250px; */
/*  overflow: scroll;   */
}

div.feature7narrow img {
/*  border: 5px solid white; */
  float: left;
/*  height: 300px; */
  height: 200px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}

/* div.feature stuff for issue 7 cover  */
div.feature7 {
  background-color: white;
  border: none;
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 0px;
/*  margin-left: 12%;
  margin-right: 12%; */
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
/*  width: 76%; */
  width: 100%;
  float: center;
}

div.feature7_left_filler {
  display: inline-block;
  width: 30%;
  float: left;
  text-align: center;
}

div.feature7 h1 {
  color: black;
  font-size: 160%;
  top-margin: 10px;
  bottom-margin: 10px;
  left-margin: 12%;
  right-margin: 12%;
/*  padding: 5px;*/
  text-align: center;
}

div.feature7 h3 {
  color: black;
  font-size: 120%;
  margin: 10px;
  padding: 5px;
  text-align: left;
}

div.feature7 p {
  color: black;
/*  font-size: 100%; */
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  /*padding-right: 20px;*/
  text-align: left;
  height: 200px;
/*  height: 250px; */
/*  overflow: scroll;   */
}

div.feature7 img {
/*  border: 5px solid white; */
  float: left;
/*  height: 300px; */
  height: 200px;
  margin-top: 0px;
  margin-left: 20px;
  margin-right: 25px;
  margin-bottom: 15px;
}


/* Issue 7 subfeatures identical to issue 6 except for image widths */
div.subfeature7a {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature7a img {
/*  width: 80%; */
  width: 50%;
}

div.subfeature7a p {
  color: black;
  display: inline-block;
/*  font-size: 100%; */
  font-size: 80%; 
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature7b {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature7b img {
/*  width: 40%; */
  width: 25%;
}

div.subfeature7b p {
  color: black;
  display: inline-block;
/*  font-size: 100%; */
  font-size: 80%; 
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

/* end of feature stuff for issue 7 cover */

/* adjusted image widths for subfeature issue 8 */
div.subfeature_leftnew {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature_leftnew img {
  width: 36%;
}

div.subfeature_leftnew p {
  color: black;
  display: inline-block;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature_rightnew {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature_rightnew img {
  width: 30%;
}

div.subfeature_rightnew p {
  color: black;
  display: inline-block;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}


div.subfeature_8l {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature_8l img {
  width: 75%;
}

div.subfeature_8l p {
  color: black;
  display: inline-block;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature_8r {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature_8r img {
  width: 25.5%;
}

div.subfeature_8r p {
  color: black;
  display: inline-block;
  font-size: 80%;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

/* end of subfeature8 stuff */


/* For issue 9 cover subfeature (modified heights from issue 6 in lieu of relative width) */
div.subfeature9a {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature9a img {
  width: 67%;
}

div.subfeature9a p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature9b {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature9b img {
  width: 63%;
}

div.subfeature9b p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}



/* For issue 10 cover customized feature, playing with the height of feature10a,b,c img (note feature10? p has height 40px less than img height */

div.feature10t {
  display: inline-block;
  width: 100%;
  float: left;
  text-align: center;
}
 
div.feature10t img {
  width: 38%;
}

div.feature10t p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}


div.subfeature10a {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature10a img {
  width: 62%;
}

div.subfeature10a p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature10b {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature10b img {
  width: 33%;
}

div.subfeature10b p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}


div.subfeature10c {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature10c img {
  width: 50%;
}

div.subfeature10c p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 150%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}

div.subfeature10d {
  display: inline-block;
  width: 50%;
  float: left;
  text-align: center;
}

div.subfeature10d img {
  width: 40%;
}

div.subfeature10d p {
  color: black;
  display: inline-block;
  font-size: 16px;
  line-height: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  padding: 5px;
  padding-right: 20px;
  text-align: left;
}




/***** End of subfeature customization ******/


span.image2 {
	
}

span.image2 a:hover {
  background-color: white;
  color: white;
  text-decoration: none;
}

span.image a:hover {
  background-color: white;
  color: white;
  text-decoration: none;
}

span.excerpts {
  font-size: 50%;
}

  /* end of divs that are used exclusively for home page */

/* a generic links */

  /* masthead & footer section: 404.shtml & include_footer.htm */
div.masthead_container {
  background-color: white;
  border-radius: 7px;
  color: black;
  font-size: 85%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  text-align: center;
}

div.footer {
  background-color: black;
  border-radius: 7px;
  color: white;
  font-size: 85%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  text-align: center;
}

a:link {
  color: blue;
}

a:visited {
  color: purple;
}

a:hover {
  background-color: blue;
  color: white;
  padding: 2px;
}

a:name {
  background-color: blue;
  text-decoration: none;
}

hr {
  color: #C8C8C8;
}

/* Issue related stuff */

  /* table of contents */

div.newslettertop {
/*  background-color: palegoldenrod;*/
  background-color: black;
  border-radius: 7px;
/*  color: black;*/
  color: white;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 5px;
  text-align: left;
}

div.newslettertopright {
  display: inline;
  float: right;
  padding-right: 20px;
  text-align: right;
  width: 28%;
}

div.newslettertopcenter {
  display: inline;
  float: right;
  text-align: center;
  width: 44%;
}

div.newslettertopleft {
  display: inline;
  /*float: left;*/
  padding-left: 20px;
  text-align: left;
  width: 28%;
}

div.tocpadding {
  background-color: none;
  /*border: 4px solid black;*/
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 4%;
  float: left;
  
/*  freeze panel effect (needs experimentation)
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;*/
}

div.toc {
  background-color: white;
  /*border: 4px solid black;*/
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 20%;
  float: left;
  
/*  freeze panel effect (needs experimentation)
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;*/
}

  /* Issue # */
div.toc h1 {
  font-size: 150%;
  margin-left: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

  /* "Table of Contents" */
div.toc h2 {
  font-size: 115%;
  margin-left: 5px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: left;
}

  /* Section, e.g. Editorial, Poetry, etc. */
div.toc h3 {
  font-size: 115%;
  font-weight: normal;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: left;
}

div.toc h4 {
  font-size: 90%;
  font-weight: normal;
  margin-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: center;
}

div.toc h5 {
  font-size: 90%;
  font-weight: normal;
  margin-left: 15px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: left;
}

div.toc li {
  font-size: 90%;
  font-weight: normal;
  margin-left: 15px;
  margin-top: 0px;
  margin-bottom: 0px;
  text-align: left;
}

div.toc a:link {
  color: darkblue;
  text-decoration: none;
}

div.toc a:visited {
  color: purple;
  text-decoration: none;
}

div.toc a:hover {
  background-color: blue;
  color: white;
  padding: 2px;
  text-decoration: none;
}

div.prevpagebutton {
  display: inline;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 43.3px 25px 0;
  border-color: transparent #007bff transparent transparent;
  margin: 10px;
}

div.nextpagebutton {
  display: inline;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 0 25px 43.3px;
  border-color: transparent transparent transparent #007bff;
  margin: 10px;
}

div.issues_container {
  background-color: black;
  /*border: 4px solid black;*/
  border-radius: 7px;
  margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 100%;
  float: left;	
}

div.previous_issues {
  font-size: 16px;
  padding-top: 5px;
  padding-bottom: 5px;
  width: 100%;
  text-align: left;
}

div.previous_issues h1 {
  color: white;
  font-size: 200%;
  margin-top: 5px;
  padding-top: 10px;
  text-align: center;
}

div.toc img {
  align: center;
  border: none;
}

div.toc_separator {
  /*background-color: white;
  border-radius: 7px;*/
  clear: both;
  color: black;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  /*padding: 5px;*/
  text-align: center;
  width: 100%;
}

div.aboutpage {
  background-color: white;
  border-radius: 7px;
  font-size: 16px;
  padding-top: 5px;
  padding-bottom: 5px;
  width: 100%;
  text-align: left;
}

div.aboutpage h1 {
/*  background-color: palegoldenrod;*/
  font-size: 200%;
  margin-top: 5px;
  padding-top: 10px;
  text-align: center;
}

div.aboutpage h2 {
  font-size: 120%;
  margin-left: 20px;
  margin-right: 20px;
  text-align: left;
}

div.aboutpage h3 {
  font-size: 100%;
  font-weight: normal;
  margin-left: 20px;
  margin-right: 20px;
  text-align: center;
}

div.aboutpage a.white:hover {
  background-color: white;
  color: black;
}

div.AboutCreditsLeft {
  /*background-color: white;*/
  /*border: 4px solid black;*/
  /*border-radius: 7px;*/
  /*margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;*/
  color: black;
  font-size: 125%;
  font-weight: normal;
  float: left;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  width: 20%;
}

div.AboutCreditsLeft img {
  display: inline;
  float: left;
  margin-right: 10px;
  width: 150px;
}

div.AboutCreditsRight {
  color: black;
  font-size: 115%;
  font-weight: normal;
  line-height: 150%;
  padding-left: 20px;
  padding-right: 90px;
  text-align: left;
}


  /* Contact Page related */

  div.contactpage {
  background-size: 100% 100%;
  border-radius: 7px;
  padding: 5px;
  position: relative;
  width: 95%;
  text-align: center;
}

/*div.contactpage h1 {
  border-radius: 0px;
/*  border-style: dotted;
  border-width: 2px;

  border-radius: 15px;
  border-style: ridge;
  border-width: 5px;

  color: #000066;
  display: inline;
  font-size: 20px;
  padding: 10px;
  text-align: center;
}*/

div.contactpage h1 {
  margin-top: 10px;
}

div.contactemail {
/*  background-color: white;*/
  background-color: palegoldenrod;
  border-radius: 7px;
  bottom: 0px;
  color: #000066;
  font-size: 120%;
  padding: 20px;
  right: 0px;
  width: 100%;
  text-align: center;
}

div.contactemail p{
  text-align: left;
}

div.contactform {
/*  background-color: white;*/
  background-color: palegoldenrod;
  border-radius: 7px;
  border-style: outset;
  bottom: 0px;
  color: #000066;
  font-size: 120%;
  margin: 10px;
  padding: 20px;
  right: 0px;
  position: absolute;
  width: 40%;
  text-align: left;
}

#formsubmitbutton {
  background-color: #C8C8C8;
  border-radius: 7px;
  font-size: 100%;
  margin-right: 10px;
  margin-top: 10px;
  padding: 5px;
}

#formsubmitbutton:hover {
  background-color: black;
  color: #C8C8C8;
}

.row{
display: table-row;
}

.row label {
  display: table-cell;
  padding: 7px;
  text-align: right;
}

.row input {
display: table-cell;
padding: 1px;
}

.catch {
  display: none;
}

  /* Journal Pages related */
  
div.contentpage {
  background-color: white;
  border-radius: 7px;
  padding-top: 10px;
  width: 75%;
  float: right;
  text-align: center;
}

div.contentpage img {
  background-color: white;
  border-radius: None;
  margin: 1px;
  padding: 1px;
}

    /* title of piece */
div.contentpage h1 {
  color: black;
  font-size: 160%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}
    /* subtitle name of piece */
div.contentpage h2 {
  color: black;
  font-size: 160%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

    /* author */
div.contentpage h3 {
  color: black;
  font-size: 120%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

span.contentpage_header3_left {
  color: black;
  font-size: 140%;
  font-weight: normal;
  padding-left: 0px;
  padding-right: 0px;
  text-align: left;
}

    /* essay headers */
div.contentpage h4 {
  color: black;
  font-size: 14px;
  font-weight: heavy;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}

div.contentpage h5 {
  color: black;
  font-size: 110%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

div.contentpage2lang {
  background-color: white;
  border-radius: 7px;
  padding-top: 25px;
  width: 75%;
  float: right;
  text-align: center;
}

    /* font-weight different from h1, used in issue6/essay2.php */
div.contentpage h6 {
  color: black;
  font-size: 140%;
  font-weight: normal;
  line-height: 100%;
  margin-top: 20px;
  margin-bottom: 1px;
  padding: 1px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

    /* the text of the piece */
div.contentpage p {
  color: black;
  font-size: 100%;
  line-height: 150%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

div.contentpage blockquote {
  line-height: 125%;
  margin-bottom: 12px;
  margin-left: 80px;
  margin-right: 0px;
  margin-top: 12px;
  padding-right: 30px;
  text-align: left;
}

/* Images with captions */
div.img-with-text28 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 28%;
}

div.img-with-text28 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.img-with-text33 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 33%;
}

div.img-with-text33 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.img-with-text33L {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  width: 33%;
}

div.img-with-text33L img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}


div.img-with-text38 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 38%;
}

div.img-with-text38 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.img-with-text40 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 40%;
}

div.img-with-text40 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.img-with-text45 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 45%;
}

div.img-with-text45 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.img-with-text50 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 50%;
}

div.img-with-text50 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.img-with-text50 p {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 0px;
  margin-right: 0px;
  padding-left: 0%;
  padding-right: 0%;
  text-align: left;
}
div.quotation-with-text50 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  padding-left: 19%;
  padding-right: 19%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
  width=50%;
}

div.img-with-text62 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 62%;
}

div.img-with-text62 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.art-with-text62 {
  color: black;
  font-size: 100%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  width: 62%;
}

div.art-with-text62 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}

div.art-with-text62 p {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 90%;
}

div.img-with-text90 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  margin-bottom: 1px;
  margin-left: auto;
  margin-right: auto;
  text-align: right;
  width: 90%;
}

div.img-with-text90 img {
  display: block;
  margin: 1px 1px 1px 1px;
  width: 100%;
}


    /* author */
div.contentpage2lang h3 {
  color: black;
  font-size: 120%;
  font-weight: normal;
  text-align: center;
}

span.caption {
  color: black;
  font-size: 85%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

div.caption_right {
  color: black;
  font-size: 85%;
  font-weight: normal;
  margin-top: 1px;
  padding: 1px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: right;
}

span.captionlarge {
  color: black;
  font-size: 110%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

span.leftcaption {
  color: black;
  font-size: 85%;
  font-weight: normal;
  padding-left: 0px;
  padding-right: 0px;
  text-align: left;
}

/* superscripts with footnotes) 
   footnoteref is the link to the citation.
   footnotes is the full citation. */
#footnoteref a:link {
  background-color: white;
  color: red;
  text-decoration: underline;
}

#footnoteref a:hover {
  background-color: white;
  color: red;
  text-decoration: none;
}

#footnoteref a:visited {
  background-color: white;
  color: black;
  text-decoration: none;
}

#footnotes {
  background-color: white;
  color: black;
  font-size: 85%;
  text-decoration: none;
}

#footnotes a:link {
  background-color: white;
  color: black;
  text-decoration: none;
}

#footnotes a:hover {
  background-color: white;
  color: red;
  text-decoration: underline;
}

#footnotes a:visited {
  background-color: white;
  color: black;
  text-decoration: none;
}

/* All these drama classes would have been used for drama1.php in issue 7, but got scrapped */
    /* title of piece */
div.dramapage h1 {
  color: black;
  font-size: 160%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}
    /* subtitle name of piece */
div.dramapage h2 {
  color: black;
  font-size: 160%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

    /* author */
div.dramapage h3 {
  color: black;
  font-size: 120%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

    /* essay headers */
div.dramapage h4 {
  color: black;
  font-size: 14px;
  font-weight: heavy;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}

div.dramapage h5 {
  color: black;
  font-size: 110%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}
div.dramapage p {
  color: black;
  font-size: 100%;
  line-height: 100%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: center;
}

div.dramaleft {
  color: black;
  display: inline;
  font-size: 100%;
  font-weight: normal;
  line-height: 100%;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
  position:relative;
  text-align: left;
/*  top: 50%;
  transform: translateY(-50%);*/
}

div.dramaright {
  /*background-color: white;*/
  /*border: 4px solid black;*/
  /*border-radius: 7px;*/
  /*margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;*/
  color: black;
  display: inline;
  font-size: 100%;
  font-weight: normal;
  float: right;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: left;
  width: 70%;
}

}
  /* for use in content pages, at webmaster discretion */
div.paintings {
  display: inline;
  text-align: center;
  width: 60%;
}

div.paintingsleft {
  display: inline;
  float: left;
  padding-left: 30px;
  text-align: center;
  width: 45%;
}

  /* artcontentpage was first used in issue #3, art#1 */
div.artcontentpage {
  color: black;
  font-size: 100%;
  line-height: 150%;
  padding-left: 19%;
  padding-right: 19%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

div.artcontentpage2 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  line-height: 115%;
  padding-left: 19%;
  padding-right: 19%;
  padding-top: 5px;
  padding-bottom: 40px;
  text-align: left;
}

div.artcontentpage3 {
  color: black;
  font-size: 85%;
  font-weight: normal;
  line-height: 115%;
  padding-left: 25%;
  padding-right: 25%;
  padding-top: 5px;
  padding-bottom: 5px;
  text-align: left;
}

div.artcontentpagewide {
  color: black;
  font-size: 100%;
  line-height: 150%;
  padding-left: 10%;
  padding-right: 10%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

  /* issue 5 cover test */
div.artcontentpagescrunchedwide {
  color: black;
  font-size: 100%;
  line-height: 100%;
  padding-left: 10%;
  padding-right: 10%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

div.artcontentpagescrunchedwide p {
  color: black;
  font-size: 100%;
  line-height: 100%;
  padding-left: 45px;
  padding-right: 45px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

img.painting {
  border: none;
  align: center;
  width: 62%;
}

/* For Issue 6, Afnan's Calligraphy, a simple black bordere */
img.paintingborder {
  border: 1px solid black;
  align: center;
  width: 62%;
}

/* For Issue 5 because cover image is way too wide */
img.paintingnarrow {
  border: none;
  align: center;
  width: 38%;
}

img.paintingwide {
  border: none;
  align: center;
  width: 80%;
}

img.paintingheight {
  border: none;
  align: center;
  height: 300px;
}

p.paintings2col {
  -webkit-column-count: 2; /* Chrome 4.0, Safari 3.1, Opera 15.0 */
  -moz-column-count:  2; /* Firefox 2.0 */
  column-count: 2; /* Internet Explorer 10.0 */
  -webkit-column-rule-width: 0px; /* Chrome, Safari, Opera */
  -moz-column-rule-width: 0px; /* Firefox */
  column-rule-width: 0px;
}

p.article3col {
  -webkit-column-count: 3; /* Chrome 4.0, Safari 3.1, Opera 15.0 */
  -moz-column-count:  3; /* Firefox 2.0 */
  column-count: 3; /* Internet Explorer 10.0 */

  -webkit-column-gap: 30px; /* Chrome 4.0, Safari 3.1, Opera 15.0 */
  -moz-column-gap: 30px; /* Firefox 2.0 */
  column-gap: 30px; /* Internet Explorer 10.0 */
  
  -webkit-column-rule-style: solid; /* Chrome, Safari, Opera */
  -moz-column-rule-style: solid; /* Firefox */
  column-rule-style: solid;  
  
  -webkit-column-rule-width: 1px; /* Chrome, Safari, Opera */
  -moz-column-rule-width: 1px; /* Firefox */
  column-rule-width: 1px;
  
  -webkit-column-rule-color: brown; /* Chrome, Safari, Opera */
  -moz-column-rule-color: brown; /* Firefox */
  column-rule-color: brown;
}

/* Play contentpage */
div.playcontentpage {
  background-color: white;
  border-radius: 7px;
  padding-top: 25px;
  width: 75%;
  float: right;
  text-align: center;
}

    /* title of piece */
div.playcontentpage h1 {
  color: black;
  font-size: 160%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

div.playcontentpage h3 {
  color: black;
  font-size: 120%;
  font-weight: normal;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

div.playcontentpage h4 {
  color: black;
  font-size: 100%;
  font-weight: heavy;
  line-height: 125%;
  margin-bottom: 1px;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 1px;
  padding-bottom: 1px;
  text-align: left;
}

div.playcontentpage h5 {
  color: black;
  font-size: 100%;
  font-weight: normal;
  line-height: 125%;
  margin-left: 60px;
  margin-bottom: 5px;
  margin-top: 0px;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 1px;
  padding-bottom: 1px;
  text-align: left;
}

div.playcontentpage p {
  color: black;
  font-size: 100%;
  line-height: 150%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

div.playcontentpage blockquote {
  line-height: 125%;
  margin-bottom: 12px;
  margin-left: 80px;
  margin-right: 80px;
  margin-top: 12px;
  text-align: left;
}

    /* author's pic, bio & artistic statement */
div.ArticleCreditsLeft {
  /*background-color: white;*/
  /*border: 4px solid black;*/
  /*border-radius: 7px;*/
  /*margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;*/
  color: black;
  font-size: 125%;
  font-weight: normal;
  float: right;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  width: 20%;
}

div.ArticleCreditsLeft img {
  display: inline;
  float: right;
  margin-right: 10px;
  width: 85%;
}

div.ArticleCreditsLeft p {
  color: black;
  font-size: 125%;
  font-weight: normal;
}

div.ArticleCreditsLeft2 {
  color: black;
  font-size: 100%;
  font-weight: normal;
  float: right;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  width: 13%;
}

div.ArticleCreditsLeft2 img {
  display: inline;
  float: right;
  margin-right: 10px;
  width: 85%;
}

div.ArticleCreditsLeft2 p {
  color: black;
  font-size: 125%;
  font-weight: normal;
}

div.ArticleCreditsLeft2Large {
  color: black;
  font-size: 100%;
  font-weight: normal;
  float: right;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  width: 38%;
}

div.ArticleCreditsLeft2Large img {
  display: inline;
  float: right;
  margin-right: 10px;
  width: 100%;
}

div.ArticleCreditsLeft2Large p {
  color: black;
  font-size: 125%;
  font-weight: normal;
}

div.ArticleCreditsLeftFacingRight {
  color: black;
  font-size: 125%;
  font-weight: normal;
  float: left;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
  width: 32%;
}

div.ArticleCreditsLeftFacingRight img {
  display: inline;
  float: left;
  width: 85%;
}

div.ArticleCreditsLeftFacingRight p {
  color: black;
  font-size: 125%;
  font-weight: normal;
}

div.ArticleCreditsRight {
  color: black;
  font-size: 100%;
  font-weight: normal;
  line-height: 150%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}

div.ArticleCreditsRight2 {
  color: black;
  font-size: 100%;
  font-weight: normal;
  line-height: 150%;
  margin-left: 50px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}

/* flanked & kill the whitespace are used in interview1.php of issue 12 */
div.flanked {
  display: flex;
  justify-content: center;
  margin-left: 19%;
  margin-right: 19%;
}

div.flanked img {
	height: 250px;
	vertical-align: middle
}

div.flanked p {
  display: inline-block;
  color: black;
  font-size: 100%;
  font-weight: normal;
  line-height: 150%;
}

#killthewhitespace {
  font-size: 100%;
  line-height: 150%;
  margin-left: 10%;
  margin-right: 10%;
  padding-top: 1px;
  padding-bottom: 1px;
}

span.center {
  text-align: c
  enter;
}

/* For Issue 12, profile1 */
div.ArticleCreditsRightColumn {
  color: black;
  font-size: 90%;
  font-weight: normal;
  float: right;
  padding-left: 30px;
  padding-right: 20px;
  text-align: left;
  width: 20%;
}

div.ArticleCreditsRightColumn img {
  display: inline;
  float: right;
  width: 100%;
}

div.ArticleCreditsRightColumn p {
  color: black;
  font-size: 90%;
  font-weight: normal;
}

div.ArticlePhotoLeft {
  color: black;
  font-size: 90%;
  font-weight: normal;
  float: left;
  text-align: left;
  width: 38%;
}

div.ArticleCreditsPhotoLeft img {
  display: inline;
  float: left;
  padding-left: 30px;
  padding-right: 20px;
  width: 28%;
}

div.ArticleCreditsPhotoLeft p {
  color: black;
  font-size: 90%;
  font-weight: normal;
}


/* Classes for specific uses */

/* artmargin used in art2.php of Issue 12 */
#artmargin_left {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 15%;
  margin-right: 15%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 0px;
  padding-bottom: 10px;
  text-align: left;
}

#artmargin_center {
  margin-top: 0px;
  padding-top: 0px;
  margin-bottom: 0px;
  padding-bottom: 0px;
  margin-left: 15%;
  margin-right: 15%;
  padding-left: 30px;
  padding-right: 30px;
  text-align: center;
}

.poetry_container {
  display: flex;  
}

.poetry_item {
  display: flex;
  margin: auto;
}

#poetry_centered {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: auto;
  margin-right: auto;
}

#poetry_senyk_issue1 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 30%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

#poetry_issue7 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 35%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

/* poetry_37 & 39, first used in issue 12 Anthony Lee */
#poetry_39 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 39%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

#poetry_37 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 37%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

#poetry_32 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 32%;
  padding-left: 32px;
  padding-right: 32px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

/* used in issue 3 */
#poetry_25leftmargin {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 10%;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

/* used in issue 2 */
#poetry_2languages {
  color: black;
  font-size: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

#poetry_28 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 28%;
  padding-left: 28px;
  padding-right: 28px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}


/* used in issue 4 & 12 */
#poetry_20 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 25%;
  padding-left: 25px;
  padding-right: 25px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

/* used in issue 12 */
#poetry_20_header {
  color: black;
  font-size: 120%;
  line-height: 150%;
  margin-left: 25%;
  padding-left: 25px;
  padding-right: 25px;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: left;
}

/* used in issue 5, poem 4 */
#poetry_18 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 18%;
  padding-left: 18px;
  padding-right: 18px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

* used in issue 11, poetry 2 */
#poetry_15 {
  color: black;
  font-size: 100%;
  line-height: 150%;
  margin-left: 15%;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
}

/* Side by side poem experiment in translation1.php, Issue 12 */
div.sidebyside {
  background-color: white;
  margin-left: 10px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 5px;
  width: 40%;
  float: left;
}
div.whiteseparator {
  /*background-color: white;
  border-radius: 7px;*/
  clear: both;
  color: black;
  font-size: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
  /*padding: 5px;*/
  text-align: center;
}

div.whiteseparator_skinny {
  /*background-color: white;
  border-radius: 7px;*/
  clear: both;
  color: black;
  font-size: 10%;
  margin-top: 1px;
  margin-bottom: 1px;
  /*padding: 5px;*/
  text-align: center;
}

  /* span.name renders "e*lix*ir" in bold
	404.shtml
	about.php
	contact.php
	include_footer.htm
  */
span.name {
  font-weight: bold;
}

/* friends page */

  /* used inside friendtext to highlight friend's name */
span.shade {
  background-color: #C8C8C8;
  font-weight: bold;
}

div.friendpage {
  border-color: black;
  border-radius: 7px;
  border-style: dotted;
  border-width: 2px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}

div.friendpage h1 {
  background-color: white; 
  border-radius: 7px;
}

div.friendnum {
  background-color: white;
  border-radius: 7px;
  width: 100%;
  float: right;
  padding-bottom: 10px;
  padding-top: 10px;
  text-align: center;
}

div.friendimg {
  /*background-color: white;*/
  /*border: 4px solid black;*/
  /*border-radius: 7px;*/
  /*margin-left: 0px;
  margin-right: 15px;
  margin-top: 0px;
  margin-bottom: 0px;*/
  color: black;
  font-size: 125%;
  font-weight: normal;
  float: left;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
  width: 25%;
}

div.friendimg a:link {
  text-decoration: none;
}

div.friendimg a:visited {
  text-decoration: none;
}

div.friendimg a:hover {
  text-decoration: none;
}

div.friendtext {
  color: black;
  font-size: 100%;
  font-weight: normal;
  line-height: 150%;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
}

div.friendtext a:link {
  color: blue;
  text-decoration: none;
}

div.friendimg a:visited {
  color: purple;
  text-decoration: none;
}

div.friendtext a:hover {
  background-color: white;
  text-decoration: underline;
}

/* thank you page - not used yet. */
div.thankyou {
  background-color: white;
  border-radius: 7px;
  color: black;
  font-size: 100%;
  line-height: 150%;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left;
  width: 100%;
}

#TahomaLarge {
  font-family: "Tahoma";  
  font-size: 18px;
  text-align: center;
}

#TahomaMedium {
  font-family: "Tahoma";  
  font-size: 14px;
  text-align: center;
}

#TahomaSmall {
  font-family: "Tahoma";  
  font-size: 12px;
  font-style: italic;
  text-align: center;
}

/* issue 5 cover test */
#TahomaLeftMedium {
  font-family: "Tahoma";  
  font-size: 14px;
  /*text-align: left;*/
}

#TahomaLeftSmall {
  font-family: "Tahoma";  
  font-size: 12px;
  font-style: italic;
  /*text-align: left;*/
}
/* end of issue 5 cover test */