{
       box-sizing:border-box;
    }

/* -------------------------------------------------Styling for my home page. --------------------------------------------- */

h1  {                              /* My home page's top line (the page's title) uses h1. */
        font-family:Times New Roman;
        font-size:60px;
        color:blue;
        text-align:center;
 }


/* h3 is used in (1) For_Literary_Agents.html, (2) For_Writers.html, (3) Editorial_Services.html, and (4) Alexander Bird.html. What else? */

h3  {
        font-family:Times New Roman;
        font-size:40px;
        color:red;
        text-align:center;
 }

/* -----------------------------------------------Styling my home page's 8-item horizontal navigation bar ----------------------------

To get the links colored red, I must select on a[href]. 12-20-2021 Another way to get several links arranged horizontally is to use the <nav> element. That's what it was created to do, and it's simpler than using flexbox! */

.Links-container {display:flex; justify-content:space-between; }

A[href] { color:red; }


/* -------------------------Styling the top line on 7 of the 8 items comprising my home page's horizontal menu bar------------------------- */

/* The following code creates the top line on the page to which 7 of the 8 links on my home page take the user. Each of the 7 pages begins by creating at the top of the screen a 3-cell flex container. Those 3 cells are populated from left to right.
   Cell 1 --- It has a "Home" link.
   Cell 2 --- It has the page's title.
   Cell 3 --- It has &emsp;.
The contents of all 3 cells then should be on the same line (row)! Begin by selecting the container and declaring it a flexbox; then set the type of spacing between cell items. */

#textbox {display:flex; justify-content:space-between;}


<!-- .middle-cell {font-family:Times New Roman; font-size:60px; font-weight:bold; color:blue;} -->

.middle-cell {h1}



/* ------- To create a border -------- */

.Border {padding:5px; border:4px solid red;}   /* To put a border around each of my 2 images and some paragraphs. Assign each img tag or paragraph a class name of "Border". */


.Justified {text-align:justify} /* The text of all paragraphs whose class name is "Justified" is to be justified. */


/* ------- For tables -------- */

table { border-collapse: collapse; margin-right: auto; margin-left: auto; }
table, th, td { border: 2px solid red; padding: 5px;}