
.Greek {
       font-family : "Gentium, Palatino Linotype, Titus Cyberbit Basic, Aisa Unicode, Arial Unicode MS, Cardo, Microsoft Sans Serif";
	   font-size:10pt;
       }
div.menu
{
	font-family: "Verdana", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
div.body
{
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
}
h2, span.title {
	    margin-left: 20px;
		font-family: "Verdana", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	    font-size:18pt;
	    margin-bottom: 0px;
		}       
h3 {
	    font-size:13pt;
		text-indent : "50px";
	    margin-bottom: 0px;
		}       

h4 {
	    font-size:11pt;
		text-indent : "5px";
	    margin-bottom: 5px;
		}       

body, p, p.para, html, td, li {
		font-family: "Verdana", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-size:10pt;
		text-align:justify;
		text-justify:inter-word;
		}
th {
		font-family: "Verdana", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
		font-weight: bold;
		font-size:10pt;
		text-align:center;
		text-justify:inter-word;
		}

blockquote {
		text-align:justify;
		text-justify:inter-word;
		}

/*
 * Tables: specify the class on the table tag, and the tags inside will pick up the child styling
 */
.wiki_table
  {
  margin:8px;
  border:1px solid #cccccc;
  height:auto;
  width:auto;
  display:inline-block;
  border-collapse:collapse;
  }
.wiki_table th
 {
  border: 1px solid #cccccc;
  background-color:#eeeeee;
  padding:5px;  
 }
.wiki_table td
 {
  border: 1px solid #cccccc;
  background-color:#fafafa;
  padding:5px;  
 }
 
/*
 * Tables: specify the class on the table tag, and the tags inside will pick up the child styling
 * Leftmenu_base - original.  Used now mainly for boxes in CIMRM pages.
 */
.menu_table
  {
  margin:0px;
  border:1px solid #cccccc;
  height:auto;
  width:auto;
  display:inline-block;
  border-collapse:collapse;
  }
.menu_table th
 {
  border: 1px solid #cccccc;
  background-color:#eeeeee;
  padding:5px;  
 }
.menu_table td
 {
  border: 1px solid #cccccc;
  background-color:#fefefe;
  padding:2px;  
  font-family: "Verdana", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
  font-size:9pt;
  text-align:left;
  text-justify:inter-word;
 }

/* -- leftmenu_base.htm table - start -- */
.rTable { 
  display: table; 
  width: 100%; 
  margin:0px;
  border:1px solid #cccccc;
  height:auto;
  border-collapse:collapse;
  background-color:#eeeeee;
} 
.rTableRow { display: table-row; } 
.rTableCell { 
  display: table-cell; 
  border: 0px solid #cccccc;
  background-color:#f0f0f0;
  padding:2px;  
  font-family: "Verdana", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
  font-size:9pt;
  text-align:left;
  text-justify:inter-word;
}
/* -- leftmenu_base.htm table - end -- */

 div.tocfixed
  {
  margin:8px;
  border:1px solid #cccccc;
  height:auto;
  width:auto;
  display:inline-block;
  }
div.toc
  {
  margin:8px;
  border:1px solid #cccccc;
  height:auto;
  width:auto;
  float:left;
 }

/* -----------------Responsive stuff------------------- */

.middlemenu {
	background-color:#ffffff;
}

.sidebar {
	border-left:1px solid #dddddd;
	background-color:#fcfcfc;
}

/* Hide the list item that contains the link that should open 
   and close the topnav on small screens */
span.icon {display: none;}

/* When the screen is LESS than 680 pixels wide, hide sidebars, tocs. 
   Show the "icon" link for the responsive menu.
   Give the middle menu box a grey background   */
@media screen and (max-width:680px) {

  td.sidebar {display: none;}
  div.tocfixed {display: none;}
  div.toc {display: none;}
  
  span.icon {
    float: left;
    display: inline-block;
  }
  
  td.middlemenu {background-color:#fcfcfc;}
}

/* --------------End of responsive stuff-------------- */

/* -----------------Responsive stuff 2 for CIMRM pages------------------- */
/* The idea is to make the two panels stack one above the other; images, then text */

.wrapper { 
  overflow:hidden;
  vertical-align: top;
}

.wrapper div {
   min-height: 10px;
   padding: 10px;
}

/** Width of 400 sets the whole left column stuff */
#one {
  float:left; 
  margin-right:20px;
  width:400px;
  vertical-align: top;
  border: 0;    
}
#two { 
  overflow:hidden;
  margin:10px;
  min-height:170px;
  vertical-align: top;
}

/** width becomes 100% when responsive, and max-width also. */
@media screen and (max-width: 680px) {
   #one { 
    float: none;
    margin-right:0;
	width:100%;
	max-width: 100%; 
	overflow:hidden;
    border-bottom:2px solid #000;    
  }
}

/* --------------End of responsive stuff 2-------------- */
 
/* Stuff from the original definitions */  
div.img
  {
  margin:8px;
  border:1px solid #cccccc;
  height:auto;
  width:auto;
  float:right;
  }
div.imgleft
  {
  margin:8px;
  border:1px solid #cccccc;
  height:auto;
  width:auto;
  float:left;
  }
div.img img
  {
  display:inline;
  margin:5px;
  border:1px solid #ffffff;
  }
div.img a:hover img
  {
  border:1px solid #0000ff;
  }
span.desc
  {
  text-align:center;
  font-weight:normal;
  font-size:8pt;
  }
span.edit
  {
  font-size:8pt;
  }
span.footnote
  {
  text-align:justify;
  font-weight:normal;
  font-size:8pt;
  }
hr
  {
  color:#cccccc;
  background-color:#cccccc;
  border:0px solid #000;
  height:1px;   
  }
  
li.gallerybox{vertical-align:top;display:-moz-inline-box;display:inline-block}
ul.gallery,li.gallerybox{zoom:1;*display:inline}
ul.gallery{margin:2px;padding:2px;display:block}
li.gallerycaption{font-weight:bold;text-align:center;display:block;word-wrap:break-word}
li.gallerybox div.thumb{text-align:center;border:1px solid #ccc;margin:2px}
div.gallerytext{overflow:hidden;font-size:80%;padding:2px 4px;word-wrap:break-word}  
div.thumb{border:none;width:auto;margin-top:0.5em;margin-bottom:0.8em;background-color:transparent}

/*
 *  Images
 */
div.thumb {
    margin-bottom: 0.5em;
    width: auto;
    background-color: transparent;
}
div.tright {
    clear: right;
    float: right;
    margin: 0.5em 0px 1.3em 1.4em;
}

div.tleft {
    clear: left;
    float: left;
    margin: 0.5em 1.4em 1.3em 0px;
}

/** build the box */
.mw-content-ltr .thumbcaption {
    text-align: left;
}
html .thumbcaption {
    border: medium none;
    line-height: 1.4em;
    padding: 3px !important;
    font-size: 94%;
}
div.thumbinner {
    font-size: 94%;
    text-align: center;
}
div.thumbinner {
    border: 1px solid rgb(204, 204, 204);
    padding: 3px !important;
    background-color: rgb(249, 249, 249);
    font-size: 94%;
    text-align: center;
    overflow: hidden;
}
.thumbinner {
    min-width: 100px;
}

/** Ensure we don't use serif anywhere */
html, body {
    font-family: sans-serif;
    font-size: 1em;
}

/** img.thumbimage stuff */
div.thumb .thumbimage {
    background-color: rgb(255, 255, 255);
}
html .thumbimage {
    border: 1px solid rgb(204, 204, 204);
}
/** 
The max-width: 100% and width: 300px (or whatever) 
combined ensures that pics are never wider than the screen; 
they are 300px or 100% whichever is smaller.  See

https://css-tricks.com/tale-width-max-width/

Anyway it’s nice that max-width: 100%; works, so on old websites 
where you have a lot of fixed widths, you can tempt to apply a 
global max-width: 100% rule to make it responsive ;)
*/
img {
    border: medium none;
    vertical-align: middle;
/*	FIX THIS TODO  Use Mithras and Christianity page */
	max-width: 100%;
}

/** references */
sup {
	font-size: 83%;
	vertical-align: super;
}
f