<HTML>
<HEAD>
<TITLE>RG2.CSS</TITLE>
<!-- Comments:
20060429..  (prev rg2.css was used 19980405..20051212. 20051213..60429.)

RG2.CSS, before more styles ala fp and others, was a simple style sheet with:
 - Font-family default globally:
    Arial, Helvetica, sans-serif
 - H1-2 and now H3 headings:
    Centered
 - H4-7 headings:
    Left

20050730  H3 to go center

rem:
 curly bracket w/o a name may work where no P??...

HTML should always Comment the area within STYLE../STYLE, so older browsers
  - will not try to process css definitions. Newer browsers
  - will use the definitions tho between comment tags.

Note: Blank lines WITHIN style definitions DO affect the style, tho comment lines pby do not

-->


<!--  Notes from an rg outline of the fp bm hall of shame page:

Catalog style equivalent terms that prodmdb-created lb-shsl.htm etc. might possibly use. Add ..._02 for another styles set?:

thumb_container listing_container
 thumb_frame    listing_background   Note that style's url is not stretchable it seems
  thumb_image   listing_foreground_img
 arrow          listing_img_additional  Can be a link button
 name           listing_title !
 title          listing_subtitle
 text           listing_dscrptn
divider         listing_divider

Divs, with classes "", related to prod-like record displaying  (Can be like catalog items with background-image, foreground leftward image, title, subtitle, button, and dscrptn.)  A name (prodtitle) here is not above but is adjacent to the foreground image.

"thumb_container" (style has preset a width, here as 480px)
   "thumb_frame" (style has preset a background's -image url etc)
      img (foreground) like bust photo  with class of "thumb_image"
   /div "thumb_frame"
   "arrow"
      img of standard button to link to a biography page or section
   /div "arrow"
   "name"
      text is person's name
   /div "name"
   "title"
      text is person's title
   /div "title"
   "text"
      text is long descriptive paragraph
   /div "text"
/div "thumb_container"
"divider"
"thumb_container" next
...


#mainbox  740px
  #headerbox
  #leftbar
  #content  740px
    .thumb_container  480px
      foreground image 65px and text to right and under the image
        background image  e.g. a bdr or shdw
          background color
    .thumb_container
      .background_155x160 may exist someday
    .thumb_container
      .background_nnnxmmm may exist someday
  #rightbar  190px
    #votebox  180px
      .sbheader
      .sb...
      .sbbottom  180px
    #friendbox
    #fpbox
  #bottomblock  

#ruleslayer is unused but would be hidden and do what?
-->

<STYLE type="text/css">
<!--

body {
	background-color:    #ffffff;
	margin-left:20px;
	margin-top:0px;
	padding:0px;
	/* From longtime rg2.css: */
      font-family: Arial, Helvetica, sans-serif;
      /* # means ????? */
      /* . means any element might try to use this as a div class=this????? */
}

H1, H2, H3 {
	/* From longtime rg2.css: */
      text-align:          center
}

H4, H5, H6, H7 {
	/* From longtime rg2.css: */
        text-align: left
}

#headerbox {
      /* Began ala fp #headerbox */
	/* fp had margin:0px padding:0px */
	margin-top: 002%;
	margin-left: 002%;
	margin-right: 002%;
	margin-bottom: 002%;
	padding: 000%;
}

#mainbox {
      /* Began ala fp #mainbox */
	text-align:center;
	/* */
	/* fp had width:    740px */
        width: 100%; 
	/* */
}

#content {
      /* Began ala fp #content */
	/* fp had
         text-align:left;
         width:    740px
         padding:0px;
	 background-color:#333333;
      /* Can url in a style use relative address like ../ ? */
	 background: url(../3/main_bkgnd.gif) repeat-y left;
        */
	text-align:left;
        width: 85%; 
	padding: 01%;
	background-color:   green;
	background: url(../3/red.gif) repeat-y repeat-x left;
}

#ruleslayer {
      /* Began ala fp #ruleslayer  What use? */
	visibility: hidden;
	color:#993333;
	border:1px solid #000000;
	background:#EEEEEE;
	padding:6px;
	position:absolute;
	text-align:left;
	font:10px arial, helvetica, sans-serif;
}

#leftbar {
      /* Began ala fp #rightbar imitation */
	float:            left;
	/* */
	/* fp had no leftbar */
        width:22px; 
	/* */
	margin-top:20px;
}

#rightbar {
      /* Began ala fp #rightbar */
	float:right;
	/* */
	/* fp had width:190px */
        width:22px; 
	/* */
	margin-top:20px;
}

#votebox, #friendbox, #fpbox {
      /* Began ala fp #votebox */
	width:180px;
	margin-bottom:10px;
	text-align:left;
}

.sbheader {
      /* Began ala fp .sbheader  subsection header? */
	height:25px;
}

.sbbottom {
      /* Began ala fp .sbbottom  subsection bottom something? filter: does what? */
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/sb_bottom.png');
	background-repeat: no-repeat;
	background-position: top left;
	width:180px;
	height:15px;
}

.sbcontent {
      /* Began ala fp .sbcontent  subsection ? content */
	background-image: url(images/sb_background.gif);
	background-repeat: repeat-y;
	background-position: top left;
	font: 10px Verdana, Arial, Geneva, Helvetica, sans-serif;
	width:180px;
	height:100%;
}

.sbtext {
      /* Began ala fp .sbtext  subsection text? */
	padding:5px 15px 5px 10px;
}

.bigsbtext {
      /* Began ala fp .bigsbtext */
	padding:5px 15px 0px 10px;	
	font: bold 11px Verdana, Arial, Geneva, Helvetica, sans-serif;
}


#mainblock {
      /* Began ala fp #mainblock */
	padding: 0%;
	/* fp had padding:25px  width:    490px */
        zzzwidth: 055%; 
	/* */
	clear:none;
	font: 11px/16px Arial, Helvetica, sans-serif;
	/* fp had disabled this red border   border:1px solid #CC0000; */
	border:1px solid #CC0000;
}

#stripes {
      /* Began ala fp #stripes  For ? over stripes.gif */
	/* padding:0px; margin:0px; width:691px; height:22px; */
	padding:0px;
	margin:0px;
	width:691px;
	height:22px;
	/* background: url(../3/stripes.gif) no-repeat; */
	background: url(../3/cyan.gif) no-repeat;
}


#bottomblock {
      /* Began ala fp #bottomblock */
	font: 10px Verdana, Arial, Geneva, Helvetica, sans-serif;
	color:#CCCCCC;
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	width:692px;
        border:1px solid #00ff00;
	/* */
	/* fp had disabled this  border   border:1px solid #993333; */
}

.text {
      /* Began ala fp .text   sb more specic naming? */
	font: 11px/15px Verdana, Arial, Helvetica, sans-serif;
}

.formlabel {
      /* Began ala fp .formlabel */
	font: bold 11px/15px Verdana, Arial, Helvetica, sans-serif;
	text-align: right;
}

.listing_title {
      /* Began ala fp .name */
	font: bold 18px Arial, Helvetica, sans-serif;
	color: #FFCC66;
}

.listing_subtitle {
      /* Began ala fp .thumb_title */
	font: oblique 12px Arial, Helvetica, sans-serif;
	color: #666666;
	margin-bottom:8px;
}

.listing_img_additional {
      /* Began ala fp .arrow */
	float:right;
	text-align:right;
	height:22px;
}

.listing_divider {
      /* Began ala fp .divider */
	width:480px;
	height:30px;
	background: url(images/divider.gif) repeat-x center;
}

.listing_background {
      /* Began ala fp .thumb_frame */
	float:left;
	width:155px;
	height:160px;
	background: red url(c:\lborg\wwwroot\3\thumb_frame.gif) no-repeat top left;
}

.listing_foreground_img {
      /* Began ala fp .thumb_image */
	margin-top:6px;
	margin-left:6px;
	border:none;
}

.listing_container {
      /* Began ala fp .thumb_container */
	width:480px;
}

.bdr155x160_shdw_image {
	zzzmargin-top:6px;
	zzzmargin-left:6px;
	border:none;
/* fp had no width: */
zzzwidth:266;
}

.bdr155x160_shdw_frame {
        /* fp had float:left  float:center   */
	/*
         - rg added color  sb white, but red for now,
            to fill container where background image and foreground do not
	 - rg may do .background_155x160, ala FP thumb stuff, and other sizes?
	 - no way known to stretch the image of background url ...
         - has been float:left   width:    155px   height:160px
             background: gray url(c:\lborg\wwwroot\3\bdr-shdw.jpg) no-repeat top left
        */
	float:left;
        /* width:144px works! */
width:   144px;
	height:160px;
	background:        orange    url(c:\lborg\wwwroot\3\bdr-shdw.gif) no-repeat top left;
}

.bdr155x160_shdw_container {
/* width here affects text folding    pby window width nor flexible? */
width:        100%;
/* fp had no float and width:480 */
float:center;
	/* */
	/* */
	/* rg may do .img_text and .text_img containers at 500?px */
}


.name {
      /* Began ala fp .name */
	font: bold 18px Arial, Helvetica, sans-serif;
	color: #FFCC66;
}

.title {
      /* Began ala fp .title */
	font: oblique 12px Arial, Helvetica, sans-serif;
	color: #666666;
	margin-bottom:8px;
}

.arrow {
      /* Began ala fp .arrow */
	float:right;
	text-align:right;
	height:22px;
}

.divider {
      /* Began ala fp .divider */
	width:480px;
	height:30px;
	background: url(images/divider.gif) repeat-x center;
}

.thumb_frame {
      /* Began ala fp .thumb_frame */
	float:left;
	width:155px;
	height:160px;
	background: red url(c:\lborg\wwwroot\3\thumb_frame.gif) no-repeat top left;
}

.thumb_image {
      /* Began ala fp .thumb_image */
	margin-top:6px;
	margin-left:6px;
	border:none;
}

.thumb_container {
      /* Began ala fp .thumb_container */
	width:480px;
}

.alert {
      /* Began ala fp .alert */
	font: bold 12px/16px Verdana, Arial, Helvetica, sans-serif; 
	color:#CC0000;
	text-align:center;
}

.small {
      /* Began ala fp .small */
	font: 9px Verdana, Arial, Geneva, Helvetica, sans-serif;
}
-->
</style>
</HEAD>
<BODY> 
RG2.CSS
<H1>
An H1 heading
</H1>
<H2>
An H2 heading
</H2>
<H3>
An H3 heading
</H3>
<H4>
An H4 heading
</H4>
<H5>
An H5 heading
</H5>
<H6>
An H6 heading
</H6>
<H7>
An H7 heading
</H7>
<PRE>
Body text looks like this.

RG2.CSS is a simple style sheet with:
 - Font-family default globally:
    Arial, Helvetica, sans-serif
 - H1-2 and now H3 headings:
    Centered
 - H4-7 headings:
    Left
</PRE>
</BODY>
</HTML>