body {
    margin: 40px;
}
.search {
    grid-area: search;
}

.letter-to-reader {
    grid-area: letter-to-reader;
}

.leftCovers {
    grid-area: leftCovers;
}

.sidebar-ad-left {
    grid-area: sidebar-ad-left;
}

.masthead {
    grid-area: masthead;
}

.sidebar-ad-right {
    grid-area: sidebar-ad-right;
}

.rightCovers {
    grid-area: rightCovers;
}

.content {
    grid-area: content;
}

.header {
    grid-area: header;
}

.nav {
    grid-area: nav;
}

.footer {
    grid-area: footer;
}

.wrapper {
    background-color: #fff;
    color: #444;
   
}

  .wrapper {
    display: grid;
    grid-gap: 1em;
    grid-template-areas:
     "beauford-ad"    
     "header"
     "nav"
     "search"    
     "letter-to-reader"
     "content"
     "masthead"
     "rightCovers"
     "leftCovers"     
     "sidebar-ad-left"
     "sidebar-ad-right"     
     "footer"
  }

   
/*.box {
  background-color: #444;
  color: #fff;
  border-radius: 5px;
  padding: 10px;
  font-size: 150%; 
}

.header,
.footer {
  background-color: #999;
}

.sidebar2 {
  background-color: #ccc;
  color: #444;
}

.sidebar2-bottom {
  background-color: red;
  color: #fff;
}*/

/*Fom original CSS

.nav {
  grid-column: col / span gutter 16; 
  grid-row: row 2 / span 1;
  
}*/

/* Colors
logo -	#8c001a  rgb (140 0 26)
*/

/* Reset --------------------------------------------------------------------------------------- */

/* http://meyerweb.com/eric/tools/css/reset/
	 v2.0 | 20110126
	 License: none (public domain)
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/*table {
	border-collapse: collapse;
	border-spacing: 0;
}*/

/* /Reset -------------------------------------------------------------------------------------- 

/*----General Settings----*/
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #000111;
	margin: 1em auto;
	max-width: 80em;
	padding: 0 1em;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	word-wrap: break-word;
	font-size: 16px;
	overflow: auto;
}
/* Elements ------------------------------------------------------------------------------------ */

p, h1, h2, h3, h4, h5, h6, li , img{
	/*padding: 2%; from Tio*/
	/*padding: 0px;*/
	margin-top: 0px;
}
em { 
    font-style: italic;
}

article, aside, details, figcaption, figure, footer, header,  hgroup, menu, nav, section {
	display: block;
}
h1{
	width: 68.750; /* 660px/960px = 6875*/
	font-size: 1.625em; /* 26px / 16 = 1.625 */ 
	font-weight: bold;
	color: #000000;
	text-align: center;
	margin-bottom: .6em;
	  text-shadow: 
                    0px 0px 0px #888,
                    -1px -1px 0px #777, 
                    -2px -2px 1px #666,
                    -3px -3px 1px #555,
                    -4px -4px 2px #444,
                    -5px -5px 3px #333,
                    -6px -6px 5px #000,
                    1px 1px 5px #ccc, 
                    2px 2px 5px #ccc,
                    3px 3px 5px #ccc,
                    4px 4px 5px #ccc,
                    5px 5px 5px #ccc,
                    6px 6px 5px #ccc;
                    
        
                filter: dropshadow(color=#ffff00, offx=1, offy=1);
 
        color: #f0f0f0;
}
h2 {
	width: 100%;
	font-size: 1.2em;
	font-weight: bold;
	text-align: left;
	color: #000000;
	margin-bottom: 0.7em;
}
h3 {
		font-size: 1.1em;
	font-weight: bold;
	text-align: left;
	color: #000000;
	margin-bottom: .6em;
}
h4 {
	font-size: 1.0em;
	font-weight: bold;
	text-align: left;
	color: #000000;
	margin-bottom: 1em;
}
h5{
	font-size: 0.9em;
	font-weight: bold;
	text-align: left;
	color: #000000;
	margin-bottom: 0.5em;
}
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	color: #333333;
	text-align: left;
	text-indent: 25px;
	margin-bottom: 6px;
	}

/* /Elements ----------------------------------------------------------------------------------- */


img {
	text-align: center;
	max-width: 93%;
	height: auto;
	width: auto;
}
#wrapper {
	margin: 0 auto;
	max-width: 1624px;
	width: 98%;
	text-align: center;
	background: #fff;
	border: 3px solid #bc001a;
	border-radius: 2px;
	box-shadow: 0 0 10px rgba(12, 3, 25, 0.8);	
}
header {
	width: 96%;
	min-height: 125px;
	padding: 5px;
	text-align: center;	
}

 .nav {
            max-width: 95%;
            
            margin-bottom: 10px;
         }
     
 .nav ul li {
            
            float: none;
            display: block;
            width: 100%;
            background: #9e8168;
            }

.nav ul li a {
  
	background: #9e8168;	
	display: block;
	padding: 0; /*5% 12%*/;
	font-weight: bold;
	font-size: 70%;
	color: #fff;
	text-decoration: none;
	text-align: center;
}
.nav ul li a:hover, nav ul li.active a {
	background: rgba(255,255,255,1.00);
	color: #9e8168;	
}
.nav li a:link, 
.nav li a:visited {
	background: #9e8168;
	color: rgb(255, 255, 255, 1.0);
	display: block;
    text-decoration: none;
	font-weight: bold;
	margin: 0 0 1.5em 0.5em;
    padding: 0.5em;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 3px 3px 3px 3px rgba(43, 43, 77, 0.5);
	-moz-box-shadow: 3px 3px 3px 3px rgba(43, 43, 77, 0.5);
	box-shadow: 3px 3px 3px 3px rgba(43, 43, 77, 0.5);
	font-size: 80%;
	-webkit-transition: background-color .75s ease;
	-moz-transition: background-color .75s ease;
	-o-transition: background-color .75s ease;
	transition: background-color .75s ease;
	
}
.nav li a:hover {
  background-color: rgba(69,68,170,1.00);
  color: rgb(255, 255, 255);
}
/*end css *navigation------------------------------------------------------------*/
    

.content {
	/*margin: 2%;*/
	padding-left: 1%;
	padding-right: 1%;
}
.main-colBorder {
	-webkit-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.letter-to-reader, .leftCovers, .masthead, .rightCovers {
    margin-left: 10px;
    margin-right: 10px;
    align-items: center;
}

.left-col-portfolio {
	margin: -2% 2%	1% 2%;
	padding-left: 1%;
	padding-right: 1%;
}
.leftColBorder {
	-webkit-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
/*----homePage----*/
.articleHeading {
	font-family: Arial, Helvetica, sans-serif;
	color: white;
	text-shadow: 1px 1px 0px #666;
	text-align: center;
	-webkit-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-bottom: 20px;
	background-color: #FFF;
	background-image: url(http://neworldreview.com/vol_11No_78/images/articleHeading.gif);
	background-position: center top;
}

Not sure where this belongs

#sidebarArticles  {
	float: right;
	width: 150px;
	padding-top: 30px;
	margin-top: 35px;
	background-color: #fff;
	color: #333;
	-webkit-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	box-shadow: 3px 3px 10px 8px rgba(0, 0, 0, 0.4);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 20px;
	background-image: url(http://neworldreview.com/vol_11No_78/images/articleHeader_2.gif);
	background-repeat: repeat-y;
}
blockquote {
	display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 60px;
    margin-right: 60px;
	font-size: 80%;	
	
}

#googleAdUnit_1 {
	margin-left: 116px;
}

/*misc css*/

.authorName {
	color: #666666;
}

.center {
	text-align: center;
}

.firstLetter {
	font-family: "Times New Roman", Times, serif;
	font-size: 36px;
}

.leftCovers a img:hover {
	width: 108%;
	height: auto;	
	margin: 0;
}

.rightCovers a img:hover {
	width: 108%;
	height: auto;	
	margin: 0;
}

.imageLeft {
	float: left;
	margin-top: 10px;
	margin-bottom: 20px;
	margin-right: 10px;
}
.imageRight {
	float: right;
	margin-top: 10px;
	margin-bottom: 20px;
	margin-left: 10px;
}
.imageCenter {
	display: block;
	margin: 0 auto;
}

.poem {
	font-family: Georgia, 'Times New Roman', Serif;
	margin: 20px 0;
	padding-left: 50px;
	text-indent: 0px;
	font-weight: bold;
	line-height: 1.2em;
	/*font-style: italic;*/
	}
.poemHome {
	padding-left: 10px;
	}	
.masthead-text {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-bottom: 0;	
}

.indent-0 {
	text-indent: 0;
}
.italic {
	font-style: italic;	
}

 

 @media only screen and (min-width: 640px)   {
        .wrapper {
      grid-gap: 20px;
            grid-template-columns: 1fr 3fr 1fr;
            grid-template-areas:
      "beauford-ad beauford-ad beauford-ad"          
      "header  header  header"
      "nav nav nav" 
      "search search search"
      "letter-to-reader content masthead"
      "sidebar-ad-left content sidebar-ad-right"            
      "leftCovers content rightCovers"    
      "footer  footer  footer";
            max-width: 1920px;
        }
     
    .nav {
        margin-bottom: 50px;
    }
    .nav ul {
        list-style:none;
        margin: 20px 0 0 20px;
    }
    .nav ul li {
        float:left;
        width: 10%;
        background: #8b0020;
    }
    .nav li a:link, 
    .nav li a:visited {
	margin: 0 0 0.1em 0;
     }
     
     
     
}