MediaWiki:Common.css

/* --------------------------------------------------------
                         consistent default styles
   -------------------------------------------------------- */
   
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0; font-size:100%; font-weight:normal; }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol { list-style:none }
:link, :visited { text-decoration:none }
a img, :link img, :visited img { border:none }
address { font-style:normal }
q:before, q:after {content:"";} 

/* --------------------------------------------------------
                         layout styles
   -------------------------------------------------------- */

html {
	background-color: #FFF;
	overflow-y: scroll;
}

body {
	background-color: #FFF;
	width:1000px;
	margin:auto;
	padding:0;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:16px;
	line-height:1.3;
}

/* --- The container encompasses and centers the site on the screen. --- */

.container {
	position:absolute;
	right:auto;
	left:auto;
	top:0;
	width:990px;
	height:auto;
	background-color:#FFF;
	margin: 0 auto;
	padding: 0;
}

/* --- "section-nav" (left) and "site-nav" (right) frame the navigation sidebars. --- */

.section-nav, .site-nav {
	float:left;
	height:2100px;    /* Extend the column beneath the bottom of the screen */
	margin:0;
	border:1px solid #930;
	padding:1px;
	font-size:14px;
	font-weight:bold;
	line-height:1.3em;
	text-align:center;
	background-color:#ECF1F2;
	color: #930;
	position:fixed;
}

.section-nav {
	width:100px;     /* 104px width counting column + padding + border */
	padding-top:10px;
}
	
.site-nav {
	width:80px;   /* 84px width counting column + padding + border */
	margin-left:910px;
	margin-right:20px;
	padding-top:3px;
}

.section-nav h5, .site-nav h5 {
	margin-bottom:none;
	margin-top:none;
}

@media print {
	
	.section-nav, .site-nav {
		display:none;
	}
}

/* --- "Content" defines the central column where specific content appears. --- */

.content {
	float:left;
	width: 788px;
	margin-left:0;
	padding-top:1em;
	padding-left:114px;  /* establishes basic whitespace beteen text and navigation columns */
	padding-right:5px;
}

/* --------------------------------------------------------
                         site element styles
   -------------------------------------------------------- */

h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt {
	margin:3px;
	margin-bottom:8px;
	margin-top:8px;
}

h1, h2, h3, h4, h5, h6 {
	font-weight:bold;
	clear:both;
}

h1 {font-size:36px;}
h2 {font-size:24px;}
h3 {font-size:18px;}
h4 {font-size:18px; font-style:italic;}
h5 {font-size:14px;}
h6 {font-size:14px; font-style:italic;}

ul {
	list-style:outside;
}

dt {
	margin-left:19px;
	margin-right:19px;
}

dd {
	margin-left:35px;
	margin-right:19px;
}

li { margin-left:35px;}

ul ul, ol ol {	margin-left:51px;}

pre {font-size:12px;}

hr {width:67%;}

a:link {
	font-weight:bold;
	color:#930;
}

a:visited {
	font-weight:normal;
	color:#930;
}

table {
	font-size:14px;
	padding-left:2px;
	padding-right:2px;
}

td {
	vertical-align:top;
	text-align:left;	
}

/* --------------------------------------------------------
   Classes for presenting content
/* --------------------------------------------------------

   Class declarations for layout of substantive material. 
   These allow a lot of variations by mixing in compound class declarations for 
      <div>, <p> , <ul>, <ol>, <dl>, <blockquote>, <img>, <pre>, etc.
   Classes for citation and identifying content.
   		par1 =  numbers the paragraphs in the main text.
		  cite = numbers in the main text citing notes to it appearing to the right.
		  essaynote = corresponding number for the note to the right.
   		anno = creates a link to external material (wikipedia, etc.).
		  comment = numbers later commentary to a text.
		  par2, par3 and note = additional options if needed.
   S (standard) classes for the size and orientation of blocks.
   		sl = left (normally for paragraphs in the main essay text as it was originally printed) .
		r = right (normally with "bg" for footnotes to the original text or with "bc" for present-day comments/additions to the text).
		f = full, centered (normally for major present-day comments/additions to the text).
   B background/border options:
   		s = none/none (normally for lefthand paragraphs for original text). 
		g = gray/1px (normally for original footnotes to the text).
		c = cream/1px (normally for present-day comments/additions added to the text).
		
	Class declarations for numbered blocks will normally be 
		[class="par1 sl"] for the original main text; 
		[class="essaynote sr bg"] for original notes; and 
		[class="comment sf bc"] for current comments.
		For unnumbered blocks within those sequences, the declarations would 
      be without the first component: [class="sl"], [class="sr bg"], and [class="sf bc"].
	 
   --------------------------------------------------------  */
   
.content {
	counter-reset:par1 par2 par3 cite note1 note2 comment;
}

.par1:before {
	content:counter(par1)"¶ ";
	counter-increment:par1;
}

.par2:before {
	content:counter(par2)"¶ ";
	counter-increment:par2;
}

.par3:before {
	content:counter(par3)"¶ ";
	counter-increment:par3;
}

.anno {
	font-weight:bold;
	font-size:10px;
	vertical-align:super;
	color:#000;
}

.cite:before {
	font-weight:bold;
	font-size:10px;
	vertical-align:super;
	color:#000;
	content:" [ "counter(cite)" ] ";
	counter-increment:cite;
}

.bibli:before {
	font-weight:bold;
	font-size:10px;
	vertical-align:super;
	color:#000;
	content:" [ A"counter(par2)" ] ";
	counter-increment:par2;
}

.essaynote:before {
	content:counter(note1)"— ";
	counter-increment:note1;
}

.annotation:before {
	content:"A"counter(par3)"— ";
	counter-increment:par3;
}

.comment:before {
	content:"Comment "counter(comment)": ";
	counter-increment:comment;
}

.note:before {
	content:"Note "counter(note2)": ";
	counter-increment:note2;
}

/* --- Classes setting paragraph width and orientation. --- */

.sl {          /* --- for a standard left paragraph --- */
	max-width:500px;
}

.slc {         /* --- for centered text in left paragraph --- */
	max-width:500px;
	text-align:center;
}

.sr {          /* --- strandard paragraph to the right --- */
	float:right;
	width:400px;
	margin-left:8px;
}

.srw {         /* --- for wider paragraphs to the right --- */
	float:right;
	width:500px;
	margin-left:8px;
}

.srq {         /* --- for block quotations, screen-right --- */
	float:right;
	width:400px;
	margin-left:8px;
	padding:0 55px;
}

.bq {          /* --- for block quotations, screen-left --- */
	text-align:left;
	margin-left:40px;
	margin-right:40px;	
}

.src {         /* --- for centered text in a right paragraph, esp. picture captions --- */
	float:right;
	width:400px;
	text-align:center;
}

.src-pic {		 /* --- for situating pictures in the right column --- */
	float:right;
	margin-right:8px;
	margin-left:8px;
	text-align:center;
}

.sf, .sfc {    /* --- wide paragraph centered in the content column --- */
	margin-left:57px;
	width:650px;
}

.sfc {         /* --- wide paragraph with centered text --- */
	text-align:center;
}

.sff {         /* --- paragraph filling the content column --- */
	width:773px;
	}

/* ----------- class framing the opening header for each text = title page --- */

.opening {     
	width:773px;
	background-color:#FFC;
	border:1px solid #930;
	padding:10px;
}

.opening  h1, h2, h3, h4, h5, h6, hr, p, ul, ol, li, dl, dd, dt {
	color:#930;
}

.opening h1, h2, h3, h4, h5, h6 {
	text-align:center;
	line-height:1.5em;
}

.opening p, ul, ol, dl, li {
	text-align:left;
}

/* ----------- classes setting colors and borders --- */

.bn {          /* ---  --- */
	background-color:#FFF;
	border:none;
}

.bg {          /* --- light green background, with 1px border --- */
	background-color: #E4FEDC;
	border: 1px solid #666;
	padding-left:5px;
	padding-right:5px;
}

.bgd {         /* --- darker green background, with 1px bordder --- */
	background-color: #C6F0C7;
	border: 1px solid #666;
	padding-left:5px;
	padding-right:5px;
}

.bgr {         /* --- light gray background, with 1px border --- */
	background-color: #ddd;
	border: 1px solid #666;
	padding-left:5px;
	padding-right:5px;
}

.bc {          /* --- cream background with 1px border --- */
	background-color:#FFC;
	border:1px solid #930;
	padding-left:5px;
	padding-right:5px;
}

/* ----------- specialized classes --- */

.pic {
	float: right;
	margin-left: 5px;
}

.left {
	float:left;
}

.right {
	float:right;
}

.tight {
	margin-top:0;
	margin-bottom:0;
}

.up {          /* --- brings an identifier up to the right under something --- */
	text-align:right;
	margin-right:4em;
	margin-top:-1em;
}

.upit {        /* --- merges two bordered paragraphs with a 1px line between them --- */
	margin-top:-1em;
	border-top:none;
}

.sup {         /* --- <span class="sup"></span> puts inline text in small superscript --- */
	font-size:10px;
	vertical-align:super;
}

.cl {          /* --- clears a paragraph relative to those above it --- */
	clear:both;
}

.clearfloat {  /* --- clears at end of a file if necessary --- */
	clear:both;
	height:0;
	font-size:1px;
	line-height:0;
}

.no-clear {    /* --- Prevents a block (a heading) from clearing as it normally does --- */
	clear:none;
}

/* -------------------------------------
   CSS for slideout menus 
      .section-menu in the left sidebar
      .site-menu in the right sidebar
      .contents-menu in the central column
   ------------------------------------- */

.section-menu, contents-menu, .site-menu {
	float:left;
	padding:0;
}

.section-menu, .site-menu {
	background:#ECF1F2;
}

.contents-menu, .site-menu {
	width:80px;
}

.section-menu {
	width:101px;
}

.contents-menu {
	background:#FFC;
}

.contents-menu ul, .contents-menu li, .contents-menu a, .contents-menu h5, 
.section-menu ul, .section-menu li, .section-menu a, .section-menu h5, 
.site-menu ul, .site-menu li, .site-menu a, .site-menu h5 {
	display:block;
	font-size:14px;
	font-weight:bold;
	list-style:none;
	background:#ECF1F2;
	color:#930;
	margin:0;
	padding:0;
}

.contents-menu ul, .contents-menu li, .contents-menu a, .contents-menu h5 {
	background:#FFC;
} 
/*
.site-menu a {
	padding-right:5px;
}
*/
.site-menu a:hover, .section-menu a:hover, .contents-menu a:hover {
	background:#fff;
}

.site-menu li, .section-menu li, .contents-menu li {
	position:relative;
	text-align:center;
}

.site-menu ul ul, .section-menu ul ul, .contents-menu ul ul {
	position:absolute;
	border:1px solid #930;
	width:500px;
	color:#930;
	margin:0;
	padding:5px;
}

.site-menu ul ul, .section-menu ul ul {
	background-color:#ECF1F2;
	padding-top:5px;
	padding-bottom:5px;
}

.section-menu ul ul {
	top:-5px;
	left:96px;
	border-left:none;
}

.site-menu ul ul {
	top:-5px;
	width:400px;
	left:-395px;
	border-right:none;
}

.contents-menu ul ul {
	top:16px;
	left:0;
	background:#FFC;
}

.upmenu ul ul {
	top:-160px;
}

.contents-menu ul ul li, .contents-menu ul ul a, .contents-menu ul ul a:hover,
.section-menu ul ul li, .section-menu ul ul a, .section-menu ul ul a:hover {
	display:block;
	text-align:left;
}

.site-menu ul ul li, .site-menu ul ul a, .site-menu ul ul a:hover {
	display:block;
	padding-right:10px;
	text-align:right;
}

div.section-menu ul ul, div.section-menu ul li:hover ul ul,
div.contents-menu ul ul, div.contents-menu ul li:hover ul ul,
div.site-menu ul ul, div.site-menu ul li:hover ul ul {
	display:none;
}

div.section-menu ul li:hover ul, div.section-menu ul li:hover ul ul,
div.contents-menu ul li:hover ul, div.contents-menu ul li:hover ul ul,
div.site-menu ul li:hover ul, div.site-menu ul ul li:hover ul {
	display:block;
}

/* -------------------------------------
   sets coloring to shades of gray for printing
   ------------------------------------- */

@media print {
	.bg {
		background-color: #D8D8D8;
	}

	.bgd {
		background-color: #B0B0B0;
	}

	.bc, .opening {
		background-color:#888;
	}
}
/* CSS placed here will be applied to all skins on all Reflective Commons websites */

/*#mw-sidebar-button,  #mw-panel { display: none; }
#mw-panel #p-logo, .generated-sidebar, #p-lang, #p-tb, #t-specialpages, #t-print  { display:none; }
#column-content { margin: 0 0 1em 0; }
#content { margin: 0 0 0 0; }
#p-cactions { left: .1em; } */
/*********** Snippets ***********/
/* Combo: <div class="outbox lefty/righty thin/wide"><div class="inbox compact"> */
.mw-parser-output { max-width: 900px; margin: 0 auto 0 auto; font-family: Bahnschrift, Helvetica, Arial, 
sans-serif; font-weight: 600; }

/* This turns off the Summary of the edit box and the Minor edit check box at the bottom to the Edit Form */
#wpSummaryLabel, #wpSummaryWidget .input, #mw-editpage-minoredit { display: none; } 

/* This turns off anonymous contributions */
#pt-anoncontribs, #pt-anontalk, #pt-anonus.conterpage { display: none; }

/* Turn dislplay of the first heading off */
.firstHeading { display: none; }
/* .tocnumber { display: none; } */

.mw-footer li { font-size: 0.8em; }
.apts, .rmcc { max-width: 550px; font-size: 1.1em; line-height: 1.4em; font-weight: 500; padding: 0 2em 0 0; text-indent: 0; }
.indon { text-indent: 1.5em; }
.indoff p {text-indent: 0;}
.nums {counter-reset: ordered;}
.nums p::before, .nums li::before {counter-increment: ordered; content:counter(ordered); vertical-align: super; font-size: .7em;  }
.nums .references li::before { display: none; }
.numsoff p::before, .numsoff li::before {display: none;}
/* .notoc {display: none;} */
.thin { width: 210px; }
.wide { max-width: 320px; }
.V {margin-left:0; text-indent: 0; font-weight: 700; }
.R {padding-left:2em;  text-indent: 0; font-weight: 500; }
/* To insert an inline editorial comment <dfn> ... </dfn> */
dl {margin:0; padding: 0; text-indent: 0; font-size: 0.9em; line-height: 1.2em; }
dt {padding: 0; text-indent: 0; font-weight: 700; }
dd {padding-left: 2em; text-indent: -1em; font-weight: 500; }
dfn { font-weight: 700; color: blue;}
/* To insert an extended editorial comment in the right side of screen
/*    <bdo> ... </bdo>  */
.bdo {
    float: right; clear: right;
    width: 290px; margin: 0.5em -320px 0.5em 0;
    text-indent: 0; font-size: 0.9em; line-height: 1.1em; font-weight: 700;
    color: blue;
}
/* ul li {margin-left: 2em; text-indent: -2em; } */
.source { font-size: 0.8em; line-height: 1.1em; text-align: right; margin-top: -1em; }
.lt {font-family: Bahnschrift, Helvetica, Arial, sans-serif; }
.mx {color: #852d10; border: 1px solid #852d10; border-collapse: collapse; }
.m0 {color: #852d10; border: 1px solid #852d10; border-collapse: collapse; padding: 0.5em;}
.m1 {width: 9em; text-align: center; vertical-align: top; color: #852d10; border: 1px solid #852d10; padding: 0.5em; }
.m2 {width: 33%; text-align: center; vertical-align: top; font-size: large; font-weight: 800;color: #852d10; border: 1px solid #852d10; padding: 0.5em; }
.m3 {text-align: left; vertical-align: top; font-size: medium;color: #852d10; border: 1px solid #852d10; padding: 0.5em; }
.c25 {width: 25%; text-align: left; vertical-align: top; font-size: medium;color: #852d10; border: 1px solid #852d10; padding: 0.5em; }
.c33 {width: 33%; text-align: left; vertical-align: top; font-size: medium;color: #852d10; border: 1px solid #852d10; padding: 0.5em; }
.container {position: relative; margin: 1em 0 0 0; }
.NavBlockOut, .NavRmccOut {
	float:right; clear: right; 
	color: #852d10; background: #ffdbb6; 
	border: 1px solid #852d10; border-radius: 4px; 
	margin: 0 -300px 4px 4px; 
	padding: 4px;
}
.NavBlockOutS, .NavRmccOutS {
	float:right; clear: right; 
	color: #355269; background: #b4c7dc; 
	border: 1px solid #355269; border-radius: 4px; 
	margin: 0 -400px 4px 4px; 
	padding: 4px;
}
.NavBlockInUpper, .NavRmccInUp {
	color: #852d10; background: #faebd7; 
	border: 1px solid #355269; border-radius: 4px; 
	margin: 4px; 
	padding: 10px 6px 10px 6px;
}
.NavBlockInUpperS, .NavRmccInUpS {
	color: #355269; background: #dee6ef; 
	border: 1px solid #355269; border-radius: 4px; 
	margin: 4px; 
	padding: 10px 6px 10px 6px;
}
.NavBlockInMiddle, .NavRmccMid {
	color: #852d10; background: #faebd7; 
	border: 1px solid #852d10; border-radius: 4px; 
	margin: 4px; 
	padding: 10px 6px 10px 6px;
}
.NavBlockInMiddleS,.NavRmccMidS {
	max-width: 310px;
		color: #355269; background: #dee6ef; 
	border: 1px solid #355269; border-radius: 4px; 
	margin: 1em auto 4px auto; 
	padding: 10px 6px 10px 6px;
	}
.parabox {
	position: absolute; top: -0.5em; left: 555px; bottom: auto;
	border-left: 1px solid gray;
	margin-right: 3em;
	padding-left: 0.5em;
	max-width: 5em;
	text-align: center;
	font-size: 0.8em;
	color: gray;
}
.box300 {
	position: absolute; top: -.5em; left: 605px; bottom: auto;
	max-width: 300px;
}
.outbox, .rbox, .cbox, .lbox, .brbox, .wbox {
	color: #852d10;
	background: #ffdbb6; 
	border: 1px solid #852d10; 
	border-radius: 4px;
	margin: .25em auto .25em auto;
	padding: .25em; 
}
.outboxb, .rboxb, .cboxb, .lboxb, .brboxb, .wboxb { 
	color: #355269;
	background: #852d10; 
	border: 1px solid #355269; 
	border-radius: 4px; 
	margin: .25em 0 .25em 0;
	padding: .25em; 
}
.outboxg, .rboxg, .cboxg, .lboxg, .brboxg, .wboxg { 
	color: #224b12;
	background: #3faf46; 
	border: 1px solid #224b12; 
	border-radius: 4px; 
	margin: .25em auto .25em auto;
	padding: .25em; 
}
.inbox, .navbar { 
	color: #852d10;
	background: #faebd7;
	border: 1px solid #852d10; 
	border-radius: 4px; 
	margin: .25em auto .25em auto;
	padding: .5em;
}
.inboxb, .navbarb { 
	color: #355269;
	background: #dee6ef; 
	border: 1px solid #355269; 
	border-radius: 4px; 
	margin: .25em auto .25em auto;
	padding: .25em;
}
.inboxg, .navbarg { 
	color: #224b12;
	background: #afd095; 
	border: 1px solid #224b12; 
	border-radius: 4px; 
	margin: .25em auto .25em auto;
	padding: .25em;
}

.boxit {
	color: #852d10;
	border: 1px solid #852d10; 
	border-radius: 4px; 
	margin: .25em; 
	padding: .25em;
}

.compact, .navbar, .navbarb, .navbarg {
	text-indent: 0;
	font-size: 0.9em; 
	line-height: 1.1em; 
	font-weight: 600;
}

.squat {
	text-indent: 0;
	line-height: 1.1em; 
	font-weight: 600;
}

.links-id { 
	text-align: center; 
	font-size: 24px;
	font-weight: 700; 
	text-indent: 0; 
	color: #f10d0c;
	margin: .5em;
}
.lbox {float: left; margin-right: 1em; }
.rbox, .tbox { float:right; clear:right; max-width: 210px; margin-left: 1em;}
.cbox { max-width: 210px; margin: 1em; }
.brbox, .rtcl300 { float:right; clear:right; margin: 0.5em -300px 0.5em 1em; }
.rt300 { float:right; margin: 0.5em -300px 0.5em 1em; }
.top { padding-top: .5em; }
.poem { margin-left: 4em; }
h1, .bh1, .head1 { font-size: 2em;  line-height: 1.1em; color:#852d10; border-bottom: 1px solid #852d10; font-weight: 700; margin: .5em 0 .5em 0; }
h2, .bh2, .head2 { font-size: 1.8em;  line-height: 1.1em; color:#852d10; border-bottom: 1px solid #852d10; font-weight: 700; margin: .5em 0 .5em 0; }
h3, .bh3, .head3 { font-size: 1.6em;  line-height: 1.1em; color:#852d10; border-bottom: 1px solid #852d10; font-weight: 700; margin: .5em 0 .5em 0; }
h4, .bh4 { font-size: 1.4em;  line-height: 1.1em; font-weight:700; color:#852d10;  }
h5, .bh5 { font-size: 1.2em;  line-height: 1.1em; font-weight:700; color:#852d10; }
.h6 { font-size: 1em; font-weight:700; color:#852d10; }
.h0 { color:#852d10; font-size: 0.8em; font-weight:500; line-height: 0.8em; text-align: center; vertical-align: middle; margin: 0; padding: 0; }
.bq { text-indent: 0; padding: 0 2em; }
.rgt { float: right; border: 1px solid #852d10; border-radius: 4px; padding: 5px; text-indent: 0; }
.cent { text-align: center; text-indent: 0; }
.und { text-decoration: underline; }
hr { width: 60%; margin: 0.5em auto 0.5em auto; }
.references  { font-size: 0.8em; }
a:link {color: black !important; text-decoration:underline; }
link {color: black !important; text-decoration:underline; }
a:visited {color: black !important; text-decoration:underline; }
a:hover {color: black !important; text-decoration:underline; }
.divide { border-top: 4px solid #1e6a39; width: 60%; }
.b3 { font-size: 1.6em; line-height: 1.8em; color: #852d10; }
.L3 { font-size: 1.6em; line-height: 1.6em; color: #852d10; }
.b2 { font-size: 1.4em; line-height: 1.6em; color: #852d10; }
.b1 { font-size: 1.2em; line-height: 1.4em; color: #852d10; }
.m0 { font-size: 1em; line-height: 1.2em; }
.s1 { font-size: 0.9em; line-height: 1.2em; }
.s2 { font-size: 0.8em; line-height: 1.1em; }
.s3 { font-size: 0.7em; line-height: 1em; }
.para {vertical-align: super; font-size: .7em; }
.lf, .lefty { float:left; margin: 0 1em 5px 0; }
.doit {text-align:right;}
.rt, .righty { float:right; clear: right; margin: 0 0 5px 1em; }
.navrt { float:right; clear: right; max-width: 210px; margin: 0 -280px 2em 1em; }
blockquote, .vector-body blockquote { border-style: none; border-left-style: none; text-indent: 0; margin: 1em 0; padding: 0 2.5em; }
.p0 {max-width: 550px;}
.delta {max-width: 550px;}
.p2 {float: right; margin-right: 50px; text-align: right;}
.up1 {float: right; margin: -1em 0 0 0;}

/* Table specs for listing a text */
.rmcclist {table-layout: fixed; width: 975px;}
/*	Insert as follows
<table class="wikitable, rmcclist">
<tr class="tl">
  <td id="c1">test</td>
  <td id="c2">test</td>
  <td id=<c3>c>test</td></tr></table> */