 /*CSS for Bearded Blogger linked pages*/
 /*ORDER of CSS attributes:
 FLOAT VALIGN T_ALIGN DISPLAY FONT TEXT COLOR BG-COLOR IMAGE BORDER MARGIN
 PADDING WIDTH HEIGHT POSITION URDL
 NOTE: In XHTML, only SOLID borders are the same color as the body color
So set inset, outset border color separately
 NOTE: "border-spacing:XXpx" will add XX pix around each section of a table,
 even if there are no borders!
 Slate red: {color:#970A00;} 27 in. monitor: 772222
 Slate blue: {color:#000A97;} 27 in monitor: 222255
 Slate green: {color:#255045;}
 Smokestack grey {color:#B4BEC8;}
 Smokestack grey (lighter): {color:#DCE6E6;}
 body {font-size:125%; <---- removed
    Displaying a "p" on the LEFT and an "a" on the RIGHT:
 Does not work with "p" inline. It's the "width:70%" that makes it work (but only with "display:inline-block")
 Works with "a" either inline or inline-block. inline-block makes the "a"s taller. NOTE: does not need "inline" or "inline-block"!!
 apparently it's the "inline-block" is only needed on the "p"!!!
  p.p_cl_test {line-height:2em; display:inline-block; width:70%;}
  a.a_cl_test {border:3px solid; display:inline-block;}
    Lining up a link and a paragraph (this note taken at another time - appears to be different from the one just before it.:
  p.p_cl_inline {display:inline}
  a.a_cl_inl_block {display:inline-block;
  NOTE: This allows the link and paragraph to be in-line. But ALL of them are in-line
  if you expand the window width. So a "break" is necessary after each set
 */
 /*   FFF8E5 */
  body {background-color:#FFFBF2; color:#663300; font-family:Arial, sans-serif; margin:5px 20px 0 20px;
  padding:0; min-width:1300px;}
  h1.h1_cl_title {font-size: 1.5em; display:inline-block;}
  a#a_id_back {display:inline-block; color:#553300; background-image:url('../images/b_blogger_back_btn.jpg');
 background-position:center; border:4px solid; width:80px; height:33px;margin: 0px 50px 5px 0px}
  a#a_id_back:hover {border:4px outset;}
  a#a_id_back:active {border:4px inset;}
  #div_id_header {background-image: url('../images/brwnpapr.gif'); margin-bottom:5px; text-align:center; border:5px solid;}
 
/* body {color:#0F1455; background-color:#EEEEEE; font: Arial,Helvetica,sans-serif;
 margin:0; padding:0; min-width:800px; height:auto;} */

 h2.h2_cl_title {margin:0; text-align:center; font-size:1em;}
 p {color:#258045; text-align:justify; margin-left:10px; margin-right:10px;}
 p.p_cl_bdr {border:1px solid;}
 p.p_cl_list {color:black; display:list-item; margin: -5px 70px 5px 70px;}
 p.p_cl_bdr_w_width {border:1px solid; width:60%;}
 p.p_cl_blk {border:1px solid; display:block;}
 p.p_cl_title {text-indent:1em; text-align:justify; color:black; margin:10px 60px 10px 10px;}
 p.p_cl_desc {color:black; margin:0px 20px 5px 20px;}
 p.p_cl_nc_desc {color:black; margin:0px 20px 5px 40px;}
 p.p_cl_inline {border:1px solid; display:inline;}
 p.p_cl_iblock {border:1px solid; display:inline-block;}
 p.p_cl_itable {border:1px solid; display:inline-table;}
 p.p_cl_inline_w {border:1px solid; display:inline; width:60%;}
 p.p_cl_iblock_w {border:1px solid; display:inline-block; width:60%;}
 p.p_cl_block_w {border:1px solid; display:block; width:60%;}
 p.p_cl_tbl {border:1px solid; display:table; width:60%;}
 p.p_cl_tbl_cell {border:1px solid; display:table-cell; width:60%;}
 p.p_cl_tbl_row_w {border:1px solid; display:table-row; width:60%;}
 p.p_cl_tbl_col_w {border:1px solid; display:table-column; width:60%;}
 p.p_cl_tbl_row_gp_w {border:1px solid; display:table-row-group; width:60%;}
 p.p_cl_tbl_col_gp_w {border:1px solid; display:table-column-group; width:60%;}
 p.p_cl_book {text-indent:1em; color:black; margin:10px 60px 10px 10px; width:400px;}
 p.p_cl_sred {color:#970A00;}
 p.p_cl_sblue {color:#000A97;}
 p.p_cl_sgreen {color:#255045;}
 
 ul {margin-top:5px; margin-bottom:0px; font-size:95%;}
 
 span {color:#970A00; font-weight:bold;}
 
/*IMAGES */
  img.img_bdr2p_15 {border:2px solid; display:table-cell; margin-left:15px;}
  img.img_bdr2p_30 {border:2px solid; display:table-cell; margin-left:30px;}
  
/*TABLES*/
 table {margin:2px 10px 5px 10px;}
 table.table_cl_2 {margin-bottom:25px;}
 td.td_cl_bdr {border:2px solid;}
 td.td_cl_rt_bdr {border:2px solid; padding-left:50px;}
 td.td_cl_bdr_w_width {border:2px solid; width: 60%;}
 td.td_cl_desc {padding:0;}
 td.td_cl_bt_bdr {border-bottom:4px solid;}
 
/*DIVS*/
 div {border:2px solid; margin: 2px 10px 25px 10px;}
 div.div_cl_show {border:2px inset; padding:10px;}
 div.div_cl_success {border:8px inset; padding:10px;}
 div.div_cl_tc_left {display:table-cell; margin:5px; width: 60%;}
 div.div_cl_tc_right {display:table-cell;padding-left:50px; vertical-align:middle;}
 div.div_cl_mgn_left {margin:5px 5px 5px 650px;}
 div.div_cl_il_table {display:inline-table;}
 div.div_cl_ft_left {float:left; margin:5px; width:600px;}
 div.div_cl_ft_right {float:right;}
 div.div_cl_clear {clear:both; margin-bottom:5px;}
 /* "name" value for "a" is DEPRECATED in HTML5 */
 div#fake_linky {display:none;}
 div.div_cl_book {display:table-cell; padding-left:50px; width:500px; vertical-align:top;}
 div.div_cl_book_r {display:table-cell; padding:10px 15px 10px 5px;}
 
/*LINKY-DINKYS
  a "display:table" breaks the p "inline-block" combo
  a "display:table-row" breaks the p "inline-block" combo
  a "display:table-column" AND a "display:table-column-group" break the p "inline-block" combo
     (It breaks the p too. Both "a" and "p" don't display AT ALL)
  a "display:table-row-group" breaks the p "inline-block" combo. Also REMOVES border for all "a"
  a "display:table-cell", along with p "display:table-cell" WORKS!!!!!!!!!!!!!!*/
 
 a {color:#970A00;  text-decoration:none; background-color:#EADADA;}
 a.a_cl_book {display:table-cell; background-color:transparent;}
 a.a_cl_bdr {border:1px solid #970A00;}
 a.a_cl_in_div {border:1px solid #970A00; margin:5px;}
 a.a_cl_tbl_cell {border:2px solid; display:table-cell;}
 a.a_cl_spec {font-size:0.9em; font-weight:bold; text-decoration:none; border:4px solid #4A4A4A; margin-left:5%;}
 a.a_cl_spec:link {color:#4A4A4A; background-color:#AAAAAA;}
 a.a_cl_spec:visited {color:#CCCCCC; background-color:#222255;}
 a.a_cl_spec:hover {color:#DD3333; background-color:transparent;}
 a.a_cl_spec:active {color:#336600; background-color:#EEDDAA;}



