body {
   /*width: 95%;*/
   background-color: #eeeef2;
   font-family: Sans-serif;
   font-size: 11pt;
   color: #333;
   word-wrap: break-word;
}


.bodydiv {
   background-color: #fff;
   max-width: 68em;
   margin-top: 1em;
   margin-left: auto;
   margin-right: auto;
   padding: .2em 2em;

}

.header {
   font-size: large;
   
}

article, main, header, footer, nav, section, .bodydiv {
   border-radius: 8px;
}

aside, blockquote, code, pre, div, img {
   border-radius: 4px;
}

.header p {
   margin: 0;
}

.plainhead {
   margin: .25em;
   font-size: xx-large;
   font-weight: bold;
}

.bodycontainer {

}

.sideleft {
   width:75%;
   float: left;
}

.contentcontainer {

}

.sidebar {
   width: 12em;
   border: 1px solid #f5f5f5;
   font-size: 90%;
   margin-right: .1em;
   margin-left: auto;
   float: right;
   padding:.1em;
}

.sidebar ul {
   margin-left: .5em;
   padding-left: 0px;
   list-style-type: none;
   /*border-bottom: 1px solid #ddd;*/
}

.sidebar li {
   border-top: 1px solid #ddd;
   margin: 1px;
}

.sidebar li a {
   display: block;
   width: 100%;
   padding: .1em;
 /*  border-bottom: 1px solid #fff;*/
}

.sidebar li a:hover {
   color: #4ba5c2;

   background-color: #f8f8ff;
  /* border-bottom: 1px solid #eee;*/
   
}

.sidebartip {
   width: 12em;
   float: right;
   font-size: .9em;
   background-color: #f5f5f5;
   padding: .5em;
   margin: -.7em 0 0.4em 1em;
   border: 1px solid #ccc;
}

/* comments */

#commentsection {
   margin-top: 2em;
   font-size: .9em;
}

#commentiframe {
   width: 98%;
   height: 40em;
}

.comment {

   border: 1px #ddd solid;
   background-color: #f8f8ff;
   padding: .5em;
   margin: 1em;

}

.cdate {
   font-size: smaller;
   float:right;
}
.ctext {
   border: 1px #ddd solid;
   background-color: #fefeff;
   padding: .5em;
   margin: .5em;
   word-wrap: break-word;
   overflow-wrap: break-word;
}

/* end comments */

a, a:visited{
   color: #2b85a2;
   text-decoration: none;
}

a.year {
   display: block;
   margin-left:.25em;
}

.extractextract,.extractfull, .content {
   border-bottom: 1px solid #eee;
   border-right: 1px solid #eee;
   background-color: #fcfcfd;
   background: linear-gradient(#f5f5f7, #fefdfe);
   padding-top: .1em;
   padding-left: 1em;
   padding-right: 1em;
   line-height: 1.5;
   overflow: auto;
   
}

.extractextract,.extractfull {
   margin-top: 1em;
   margin-bottom: 1em;
   padding-left: 0;
}

.extracttitle {
   margin-bottom: 1em;
}

.extracttext {
   padding-left: 1em;
   overflow: auto;
}

h1, h2, h3, h4, h5, h6 {
   margin: 0;
   padding-top: .2em;
   padding-left: .2em;
   margin-bottom: 2px;
}


h1 { 
   font-size: 2em;
}
h2 { 
   font-size: 1.6em;
}
h3 { 
   font-size: 1.2em;
}
h4 { 
   font-size: 1.08em;
}

.extract h2 {

   padding-left: .4em;
}

.extracttitle h1, .extracttitle h2 {
   font-size: 1.2em;
   display: inline;
}

.extracttitle h2 a, .extracttitle h2 a:visited {
   color: #444;
}

.extracttitle p, .extracttitle .shortform {
   display: inline;
   padding-left: .3em;
}

img {
   max-width: 98%;
   vertical-align: middle;
   border: 0;
   margin: .2em;
}

.thumb {
   border: thin solid #a1a;
   opacity: .5;
}

.thumb1 {
   background: url("expandicon.png");
}

.thumb2 {
   background: url("expandicon2.png");
}

.thumb1, .thumb2, .expanded1 {
   display: inline-block;
   /*background: url("expandicon.png");*/
   background-size: 30px 30px;
   background-repeat: no-repeat;
   background-position: center;
   z-index: 1;
}

.thumb1:hover, .thumb2:hover {
   /*background: url("expandicon.png");*/
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   background-clip: content-box;
   z-index: 1;
}



.meta {
   /*font-size: small;*/
   color: #777;
   background-color: #f9f9f9;
   border-top: 1px #f4f4f4 solid;
   /*border-bottom: 1px #eee solid;*/
   padding: .2em;
   margin-top: .2em;
   
}

.pubdate {
   margin-right: .2em;
   margin-left: 1em;
   font-size: small;
}

.tags {
   font-size: smaller;
   padding-top: 2px;
}

.readmorelink {
   float: right;
   font-size: smaller;
   padding-top: 2px;
   padding-right: 4px;
}

.meta .author {
   margin-right: 1em;
}

/*
 * 
 * */

.content table {
   border-collapse: collapse;
   padding: 1em;
}

.content th {
   border-spacing: .5em;
   padding: .5em;
  /* background-color: #f3f3f3;*/
}

.content td {
   border: 1px solid #aaa;
   padding: .5em;
   border-spacing: .5em;
   background-color: #f3f3f3;
}

.tcen {
   text-align: center;
}

.tleft {
   text-align: left;
}

.tright {
   text-align: right;
}


p {
   text-indent: .8em;
}

h2 p {
   text-indent: 0;
   display: inline
}

.content ul {
   margin-left: 1em;
   padding-left: 1em;
}
.content ul li {
   list-style-type: square;
}

.content ul li li{
   margin-left: -.5em;
   padding-left: .5em;
   font-size: 92%;
}

.underline {
   text-decoration: underline;
}

.monospace {
   font-family: monospace;
}

.larger {
   font-size: 130%;
}

.smaller {
   font-size: 80%;
}

.popquote {
  display:block;
  z-index:1;
  background-color: #f9f9f9;
  /*background: linear-gradient(#f3f3f3, #fefdfe);*/
  border: 1px solid #f1f1f1;
  color: #777;
  float: right;
  font: italic 150% Georgia, "Times New Roman", Times, serif;
  line-height: 1.6;
  margin: -.7em 0 0.4em 1em;
  padding: .4em;
  width: 50%;

}

/* inserts quotation marks around pullquoted text */
.popquote:before {
  content: open-quote;
}

.popquote:after {
  content: close-quote;
}

footer {
   font-size: smaller;
   margin: .5em;
}

.footnotesection .footnotep {
   display: block;
   margin: 2px;
   /*background-color: #eee;*/
   margin-bottom: .3em;
   margin-left: 1em;
}

.footnotesection .footnotep a{
   text-decoration: none;

}

.footnotelink {
   vertical-align: super;
   font-size: 60%;
   font-weight: bold;
}

.extract .footnotelink, .extract .footnotelink:hover {
   text-decoration: none;

}


blockquote {
   margin-left: .6em;
   margin-top: 2px;
   border: #e6e6f1 dashed 1px;
   border-left: #dde solid 3px;
   background-color: #f1f1f4;
   padding-left: .4em;
   padding-top: 1px;
   padding-bottom: 1px;
   white-space:pre-line;
}

blockquote p {
   padding: .1em;
   margin: .1px;
  /* display: inline;*/
}


.scrollbox {
   border: #dde solid 1px;
   padding: .3em;
}

.youtube {
   position: relative;
   background-color: black;
}

.youtube .preview {
   width: 99%;
   height: 99%;
   background: url("ytubeplayred.png") no-repeat -9999px -9999px;  /*preload for use below*/
}

.playbtn {
   background: url("ytubeplay.png");
   background-size: contain;
   background-repeat: no-repeat;   
   z-index: 2;
   position: absolute;
   top: 20%;
   left: 20%;
   bottom: 20%;
   right: 20%;
}

.playbtn:hover {
   background: url("ytubeplayred.png");
   background-size: contain;
   background-repeat: no-repeat;   
   z-index: 2;
   position: absolute;
   top: 20%;
   left: 20%;
   bottom: 20%;
   right: 20%;   
 
}
.wikipre, tt, code {
   background-color: #efefff;
   white-space: pre-wrap;
   padding: .2em;
}



.right {
   float: right;
   
}

.left {
   float: left;
}

img.center {
   margin-left: auto;
   margin-right: auto;
   display: block;
}

.pageofpage {
   margin-bottom:1em;
   font-weight: bold;
   font-style: oblique;
}

.pagelinks {
   font-size: 140%;
   font-weight: bold;
   text-align: center;
   vertical-align: middle;
}

.pagelinks .pagelink{
   margin-right: .1em;
   margin-left: .1em;
}

.nextprev {
   font-size: large;

}
.firstpage, .lastpage {
   font-size: small;
}

li.archive {
  margin-bottom: .5em;
  font-size:1em; 
}

.allartlink {
  font-size:large;
}

.shortform {
   font-size:120%;
}

.mali b {
   display: none;
}

@media only screen and (max-device-width: 780px) {
   .bodydiv {
      max-width: 99%;
      width: 99%;
      margin: 3px;
      padding: 3px;
   }

   .content, .extract {
      width: 95%;
      margin: 3px;
   }
   
   .contentcontainer {
      float: none;
      max-width: 95%;
      width: 95%;
      
   }
   
   .sidebar {
      float: none;
      margin: auto auto;
      font-size: large;
   }
   
   .pagelinks, .nextprev, .allartlink {
      font-size: large;
   }
   
   video {
      width: 95%;
   }
   

}

@media print {
   .contentcontainer {
      float: none;
      max-width: 100%;
      width: 98%;
   }

 	body, .content, .extract {
 		background-color: #ffffff;
   }

 	.sidebar, .pagelinks, .allartlink, #commentsection {
 		display: none; 	
   }
   
   all {
      background-color: #ffffff;
      color: #111;
   }
}