/* *********************** rg7.css  A css for very wide use. 20071213..20100819..
  How create a definition as a differently-named copy of a previous definition?    How create a definition that first includes a previously defined style definition?
  How body.xhead defined as body.bluss, so can then modify it somewhat?
  Priority of style element definitions is last-to-first of the cascade order of class definitions, then inline styles.  The later here supercede the earlier here.
  No external file is called by rg7.css now.
  Do these remarks slow down the page rendering?
  Remarks here sb checked after edits for start end flags still being perfectly paired.
  Remarks here are way too many!
  Many ? styles here may never be used by any .htm file linkning this rg7.css.
  rg7.css has certain styles to create tabs.
  rg7.css has certain styles to float article divs evenly on page lines.
  rg7.css may someday get the rounded corner styles? Or too many dependencies on tl- etc. file locations?
  Some pages I create use xh... classes of styles defined nearby in the HTML head section. E.g., .xhbordered.
  Using class= twice seems illegal.
  Using class= then style= seems not illegal and maybe expected. All browsers?
  Cf. also htmlcss desk shortcuts, lborg\wwwroot\demosxrg\, ...
  Find all styles herein by searching for left curly braces!
  A few styles require also including certain HTML tags for some otherwise noncompatible browser applications to emulate the styles.  ?
  To add borders to divs, helping developer viewing, a rg7-divsbordered.css of 2008 April? exists.  BEST TO add as a last style in a page's html head. Just modify div style via: div brace border: thick dashed solid semicolon brace.
 Are blank lines a problem in css file?  Even within remarks?
 Are so many remarks in this css slowing down the displaying of the pages?
 */
/* ***********************

Warning: Internet published versions of html documents SHOULD NOT RELY ON A LOCAL system stylesheet file.  A usable stylesheet file must be referenced.  Pasting the text of a complete .css, such as this file, into a head style type=text/css does work!  Or discover the styles for the head style section by Save As and examining a .mht file from a viewed HTML page.

Avoid the 'base' tag.  Or it might? work if what? "../"

Cf. also
 rg7-divsbordered.css
 rg7cssdemo.htm  rg7cssdemoUC06.htm  ../html/htmldivsrg.doc

Use css via html head having a Link tag to a file:
lessthanLINK href="../3/rg7.css" type=text/css rel=STYLESHEETgreaterthan

  A link stack implies the user will be able to choose. Question: Maybe effects do NOT cascade? Maybe the LAST link loaded is the ONLY one used?
  But the ATimports probably do CASCADE.  import is maybe like placing a file's complete contents into this file at that point.
  Do both have priorities according exactly to when first come upon in HTML?  
Use css via an html's Head having a STYLE section with text of such a file, but:
change these ways ...

  Maybe no div should have a height potentially, even implicitly, greater than, say, a screen(?), lest some browser app be delayed or confused during rendering.  Omit such div in favor of the body itself being the parent element.  RG theory 20080515.

  Plan: The structure model section here is to have not class= but only style= and a comment if rg7.css has a style rule that matches.

 */

/* ******* A File Section Names Outline. SB For templates. Draft20080516  Not the latest? :
doc xhtml tags  [xhtml transitional 1.0 seems best in 2008]
Sb. Do a demo via CSEHtmllite where ctrl-m finds pairings.

doctype  declare markup language rules place
htmlhead [meta, style, title]
body
 bodyhead incl bodyheadhead, bodyheadbody, bodyheadfoot
 bodybody [NOT to be wrapped in a div if long or has multiple floating elements]
  sidebar right [fRcn]
  sidebar y [penultimate  fr?l? cn?] x w
  stripe bar [flc?]
  navbar [flcn]
  sidebar left a
  sidebar left b [second]
  main [flcn often of unfi*ed width]
   mainhead [flcn?]
   mainbody [flcn?]
    article group nnn [fdcd: f pby N, c pby N?]
     article nnn incl articlennn head, articlennn body, articlennn foot
    article group nnn [fdcd: f pby N, c pby N?]
     article nnn incl articlennn head, articlennn body, articlennn foot
   mainfoot [flcn?]
 bodyfoot incl. bodyfoothead, bodyfootbody, bodyfootfoot

*/

/* *********************** Universal classes: NEW
  These attempts at 'universal'(?) classes do work, in IE7 at least, for many, possibly ALL(?), HTML elements!  BUT an HTML element cannot have two class=, so may often add within an HTML tag the attribute style=.
  Are some not applicable to both block-level and non???
*/
.plain {}  /* A class for plain (style= can still embellish this element). */
.centeredlr {margin-left: auto; margin-right: auto ; text-align: center}  /* This element, IF NARROWER than the containing parent, will be centered lr within its parent. Note that text-align: center is NEW HERE and may oft be what matters, 2/4/09. */
.centered {margin-left: auto; margin-right: auto ; text-align: center}  /* This element, IF NARROWER than the containing parent, will be centered lr within its parent. Note that text-align: center is NEW HERE and may oft be what matters, 2/4/09. */

.floating {float: left}  /* untested */
.floatingl {float: left}  /* untested */
.floatingr {float: right}  /* untested */
.inline {display:inline}  /*  experimenta1    fails with p     sb retry ?
 */
._special_note_ {/* ====  ==== */} /* A note within this HTML page code document that this element is special.  Often the style= has a special setting(s).
 */
.margin-none {display: inline; margin: 0em}  /* Set an element as inline, not bo*, and no margin. */
.bkg-grays          {
 background:aliceblue url('../3/bkg-grays-rounded.jpg') center center no-repeat;
 border:medium solid skyblue;
 text-align:center;
 margin: 0.50em; padding: 0.50em;
 font-family: verdana, arial, helvetica, sans-serif; 
} /*  A new style 20080510.  So, a style CAN include a filespec. Need tests if applicable to any HTML element, block or not.  */ 


/* *********************** */
body.grnss {}
body.bluss {}
body.blusf {}
body.grnsf {}
body.bluss h1, body.bluss h2, body.bluss h3 {color:blue}
body.bluss, body.grnss {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnss h1, body.grnss h2, body.grnss h3 {color:green}
body.grnss h1, body.bluss h1 {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnss h2,     body.bluss h2 {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnss h3, body.bluss h3 {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnss h4, body.bluss h4 {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnss h5 h6, body.bluss h5 h6 {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnss h5, body.grnss h6
 /* equivalent to start of the above??? */ {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.bluss h5, body.bluss h6
 /* equivalent to start of the above??? */ {font-family:  Arial, Verdana, Helvetica, sans-serif}
body.grnsf, body.blusf {font-family:  Times, 'Times New Roman', serif}

body.grnss h1, body.grnss h2, body.bluss h1, body.bluss h2 {text-align:center}
 /* text-align seems to center imgs, too. But contained elements might use display:block;margin-right:auto;margin-left:auto; in case these 3 help other browsers to center them lr in the body. */ 

body {font-size:080%}

h3 {font-size:130%}
 /* h3 100% would be 1em length == em length in body  true? */

pre {font-family:monospace}

div._clear_all_body_ {clear: both; height: 0em}
 /* 
 ====new 20080515 & needs tests.
 Go below all floating blocks. No height. Assures subsequent HTML elements are below all floating elements in the page's body so far.

 These breakers should be outside of all elements except body!
 */
div.bodybody       {}
 /* Body areas and bodybody division do not need any containing div. Especially if floating elements or great height might be involved.  */
div.centeredlr {margin-right:auto;margin-left:auto}
 /* The div as a block IF NOT FULL-WIDTH is centeredlr. */
div.centered   {margin-right:auto;margin-left:auto}
 /* The div as a block IF NOT FULL-WIDTH is centeredlr. */
div.ofcenteredtext {text-align:center}
 /* Text and elements are centered lr within this div. */
div.marginspoint7  {margin:0.700em;}
 /* border:black thin solid; */
div.marginless     {margin-top:0em;margin-right:0em;margin-bottom:0em;margin-left:0em}
 /* border:Black thin solid; */
div.marginedlr     {margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em}
 /* border:Yellow thin solid; */
div.header         {margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em}
 /* border:Orange thin solid;   div.header is now just like div.marginedlr */
div.header h1      {font-size:large ! important}
 /* E.g., :large ! important; */
div.header h2      {font-size:large ! important}
 /* E.g., :large ! important; */
div.floating       {float:left;  clear:none;margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em}
 /* border:Black thin solid; */
div.floatingr      {float:right;    clear: none ;margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em}
 /*      HEY    clear NONE may fail floatingr. SO force RIGHT again?  rg7.css users!!      border:Black thin solid; */
div.sidebar        {float:left;clear:left;margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em}
 /* border:Black thin solid;   div.sidebar is now just a copy of div.floating */
div.nonwrapping    {white-space:nowrap;margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em}
 /* border:Black thin solid; */

 /*  pg3c.css-like styles */ 
olddiv.header      {clear:both;  text-align:center
 /* default sb none? */ ;  margin-left:auto;         margin-right:auto;
         /* border:Black thin solid; */
}
div.maincontentsofpage {margin-right:0px;margin-left:0px}
 /* border:Red thin solid; */

 /* *** article.css-like styles *** */ 
div.article {clear:both; float:left; margin-right:0px;margin-left:0px}
 /* border:Green thin solid; */
 /* ****** clear:both always  or as a default that can be overridden with none */
 /* These rules are unnecessary if  above works for hn tags */
h1.centeredlr {margin-right:auto;margin-left:auto}
h2.centeredlr {margin-right:auto;margin-left:auto}
h3.centeredlr {margin-right:auto;margin-left:auto}
h4.centeredlr {margin-right:auto;margin-left:auto}
h5.centeredlr {margin-right:auto;margin-left:auto}

 /* zzzdiv.article zzzp.FirstLineSmallCaps  {display:block;margin-left:44px;padding-left:30px;  color:red;} */

 /* Special first-letter and first-line custom classes of p by bg */
p.FirstLetterLargeAndFirstLineSmallCaps:first-letter {font-size: 200%; float: left}
p.FirstLetterLargeAndFirstLineSmallCaps:first-line {font-variant: small-caps}
p.FirstLetterLarge:first-letter {font-size: 200%; float:left}
 /* FirstLetterLarge is flawed when window narrows! */
p.FirstLineSmallCaps:first-line {font-variant:small-caps}
 /* FirstLineSmallCaps is dependent on float left or right!      float:Left; clear:none;  Float ruins text wrapping sidebar! True!                 */


 /* Was testing size  header h1, header h2 {font-size:70%} */
 /* Was header h1, header h2   {font-size:110%} */
 /* As in articlennheader?  h2 sb smaller? */
 /* New 20070307 header h1 and header h2 different  */
header h1   {font-size:110%}
 /* As in articlennheader? */
header h2   {font-size:100%}
 /* h2 in header is now smaller  trying 100%  20070307 note */


a:link {color: #0000EE}
 /* unvisited link */
a:visited {color: #551A8B}
 /* visited links */
a:active {color: #FF0000}
 /* active links */
a:hover  {background-color:#eee}
 /* #eee is light gray */
 /* setting the anchor border around IMG elements requires contextual selectors */
a:visited img {border: 1px #551A8B}
 /* img visited links */
a:active img {border: 1px #FF0000}
 /* img active links */
 /* *********************** */
 /* *********************** MORE style definitions,
 Augmenting any previous but not subsequent definitions!
 If used in an HTML head, use the HTML tag pair for style type="text/css"
 */
div.articlefooter {}
 /* new 
 Size the divisions relatively, starting with the size of 1.000em in BODY

 For a good coding convention
  I will always USE em FOR WIDTHs, HEIGHTs, and other lengths,
  with the only exception that I will always USE % FOR 'FONT-SIZE:'

 */ 
div.maincontentsofpage {font-size:100%}
 /* parent is body */
div.header             {clear:both;font-size:100%}
 /* parent is body  clear:both added 20071213 */
div.footer             {clear:both;font-size:100%}
 /* parent is body  clear:both added 20071213 */
div.article            {font-size:100%}
 /* parent is usually .marginless eg maincontentsofpage */
div.articlefooter      {font-size:100%}
 /* parent is usually article */
div.sidebar            {font-size:90%}
 /* parent is usually article */

 /* testing body.h1               {font-size:010%} */

 /* testingp                      {font-size:010%} */

div.maincontentsofpage img {width:auto;height:22.2em}
 /* So lb- lists will default to 22.2em wide imgs here */

div.sidebar {}
 /* Class name different but identical??? to div.floating?? */
div.sidebar { width:22.2em}
 /*  fixed width? ???  temp, to ck img immok etc and word wrapping width  */

div.flcr {float:left;clear:right}
 /* Float left with clear right, for bunching columns to the left 20071230new  */

div.floatingr img {width:auto;height:11.0em}
 /* zzzzz So lb- lists will default to imgs of given width here */



div.articlefooter img  {width:auto;height:1.200em}
 /* as a default height */

div.nonwrapping {white-space:nowrap}
 /* No automatic new lines. Makes a nonwrappable horizontal bar of the div. Nice. */
div.sidebar            {text-align:center}
 /*  sb  Just use div class=centeredlr?      elsewhere?    custom for lb  unusual */ 
 /* *********************** */
 /* *********************** MORE style definitions,
  div.inlinelis  June 2009 RG      SOON div.rg7wbparent section IS TO BE DELETABLE!
   Defines a div class to hold wrapping blocks.
   The HTML can add style refinements for margin, border, padding, colors, etc.

  A styles group to wrap li elements as inline wrappable blocks.   june 2009
  Default here is text-align: center and vertical-align: middle.

  NOTE, IMPORTANT. The HTML FILE SHOULD ALSO HAVE, for earlier Internet explorer versions to do the wrapping pby, the following between style tags in the page head section:
 Question. Would there be any harm in just having these definitions UNconditional and in the css?

 Developer, 90606: The div.inlinelis padding seems more than the setting. Bec LI values?

 */
div.inlinelis {
 text-align:    center
 /* moot? */;
 MARGIN-RIGHT: auto; MARGIN-LEFT: auto;
 BORDER: thin pink solid;
 PADDING-TOP: 1.600em; PADDING-RIGHT: 1.600em; PADDING-BOTTOM: 0.000em; PADDING-LEFT: 0.00em;
 BACKGROUND: cornsilk url(../3/clothcreambkg.gif) repeat ;
 WIDTH: 95%; VERTICAL-ALIGN: middle;
 /* Eyeball 726 sez use asymetrical padding values */;
 /* The parent of this div should? often to have text-align center ?? */;
}
div.inlinelis UL {
 LIST-STYLE-TYPE: none;
}
div.inlinelis UL LI {
 Margin: 0.750em; border: 0.00em solid black; padding: 0.75em;
 DISPLAY: inline-block;
 VERTICAL-ALIGN:     middle; text-align:    center;
 FONT-WEIGHT:   bold;
 BACKGROUND:  	transparent;}
}
 /* div.inlinelis UL LI IMG {} */
div.inlinelis UL LI P {WIDTH: auto ;
 /* Was 1px, but auto works okay here. */;}
 /* A div.inlinelis OL group just like the UL group ******** */
div.inlinelis OL {
 LIST-STYLE-TYPE: none;
}

div.inlinelis OL LI {
 Margin: 0.750em; border: 0.00em solid black; padding: 0.75em;
 DISPLAY: inline-block;
 VERTICAL-ALIGN:     middle; text-align:    center;
 FONT-WEIGHT:   bold;
 BACKGROUND:  	transparent;}
}
 /* div.inlinelis OL LI IMG {} */
div.inlinelis OL LI P {WIDTH: auto ;
 /* Was 1px, but auto works okay here. */;}
 /* -- SB  AND add in the HTML adjustments if the browser app is lte IE 7, like OS of 726xp. 
Lessthansign!-- In case browser app is lte IE 7   Untested by IE 6 or by Safari yet   No effect ever anyway? --Greaterthansign
Lessthansign!--[if lte IE 7]Greaterthansign
 LessthansignSTYLE type=text/cssGreaterthansign
 divPeriodinlinelis UL LI Leftcurlybrace DISPLAY: inline; ZOOM: 1 Rightcurlybrace
 * HTML divPeriodinlinelis UL LI Leftcurlybrace HEIGHT: 0px Rightcurlybrace
 divPeriodinlinelis UL LI P Leftcurlybrace WIDTH: auto Rightcurlybrace

 divPeriodrg7wbparent UL LI Leftcurlybrace DISPLAY: inline; ZOOM: 1 Rightcurlybrace
 Asterisk HTML divPeriodrg7wbparent UL LI Leftcurlybrace HEIGHT: 0px Rightcurlybrace
 divPeriodrg7wbparent UL LI P Leftcurlybrace WIDTH: auto Rightcurlybrace
 Lessthansign/STYLEGreaterthansign
 Sometimes html pages have script/script sections within ifendif pair
Lessthansign![endif]--Greaterthansign
 */
 /* ********************** */
 /* ***********************
 May add more style definitions.
 Augmenting any previous, but not any subsequent, definitions!
 If defined in an HTML head, instead of CSS, then
  ...
  and use the HTML tag pair for style type="text/css"
 */
 /* *********************** */
 /* Unusual border can reveal divs and prove this stylesheet was called
  (provided no subsequent style overrides this style).
  Put this outside remarks and at bottom:
  div {border: thick dashed yellow;}
 */
/* added 20091207 */
span.articlemenupad {margin-right:1.50em;margin-left:1.50em;border:none medium transparent;background-color:transparent;padding:8pt} 
  
img.ccards {margin-top:0em;margin-right:0.200em;margin-bottom:0em;margin-left:0.200em; border-width:0em;width:auto;height:2.00em} 
  
div.art-rg001 {background:white;margin-top:0em;border:thin solid navy;clear:both} 
  
div.borderridgesilver {border:ridge 0.200em white;background:silver} 
  
span.font70percent {font-size:70%;color:black;font-weight:300} 

/* added 20091207 has ended */
/* not added 20091207 bec pby already accomplished in this .css  
   body.bluss {background:silver;max-width:76.00em;margin-left:auto;margin-right:auto;background: url(../3/bkg-blu2wht.gif) repeat-x #fffffe;} /* Modifying body.bluss style definition already here from rg7.css */ 
*/
/* added 20100128 */
.tabsbar {
	zzzborder-bottom: 1.5em solid pink;
	margin: 0px; border:0px;
	zzzpadding: 1em;

/*PROBLEM - linewrap of tabs is horrible
Spans work much better in wrap.
Now try as divs displaying inline ????? ........

 */;
font-size:120%;
text-align:center;
}

.tabsbar li { 
	display:inline; 
	border-top: .1em solid yellow;
	border-left: .1em solid yellow;
	border-right: .1em solid yellow;
}
.tab {

width:33.333em;
background:#f0f0f0;
padding-right:1em;padding-left:1em;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid gray;
	border-right: .1em solid gray;
	border-bottom: .1em solid navy;
	border-left: .1em solid gray;
}
.tabactive {

width:33.333em;
background:cornsilk;
padding-right:1em;padding-left:1em;
font-size:133.333%;
	margin-top:   1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid navy;
	border-right: .11em solid navy;
	border-bottom: .1em dashed transparent;
	border-left: .11em solid navy;
}
.tabedge {
/* THIS version without r or l is not ready to use yet */;
width:22.333em;
background:        red;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid transparent;
width:1em;
	border-right: 1em;
	border-bottom: .1em solid navy;
	border-left: 0px solid navy;
}
.tabedger {

width:22.333em;
background:transparent;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid transparent;
	border-right: 0px;
	border-bottom: .1em solid navy;
	border-left: .1em solid navy;
}
.tabedgel {

width:22.333em;
background:transparent;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid transparent;
	border-right: .1em solid navy;
	border-bottom: .1em solid navy;
	border-left: 0px;
}
.tabspacer {

width:22.333em;
background:transparent;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid transparent;
	border-right: 0px;
	border-bottom: .1em solid navy;
	border-left: 0px;
}

.tabbarendr {

width:22.333em;
background:transparent;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid transparent;
	border-right: .1em solid transparent;
	border-bottom: .1em solid navy;
	border-left: 0px;
}
.tabbarendl {

width:22.333em;
background:transparent;
	margin-top:1em;margin-right:0px;margin-bottom:1em;margin-left: 0px;
	border-top: .1em solid transparent;
	border-right: 0px;
	border-bottom: .1em solid navy;
	border-left: .1em solid transparent;
}
/* added 20091207 has ended */
.__NOT_DISPLAYED__ {display:none}
/* added 20091207 has ended */
