/* GENERAL STYLES */
body {
    margin-top: 0;
    color: #eee;
    box-sizing: border-box;
    }
img {
    max-width: 100%;
    height: auto;
    }
* p {
   padding-bottom:3px; 
   }
@font-face {
  font-family: Old-Eng;
  src: url(fonts/Canterbury.ttf);
  /*  'old english text mt'  */ 
  }
h1 {
    font-family:Old-Eng;
    font-size: 2.5em;
    }

/* GRID LAYOUT STYLES */
page {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(10px, auto);
    }
header {
    background: url("../images/OldBooks.png");
    background-size: cover;
    padding:2rem 0;
    grid-column: 1/7;
    display: grid;  
    justify-items: start;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

/* navigation */
nav { place-self:center;  }
nav ul {
    display:flex;
    flex-wrap:wrap;
    justify-content:start;
    row-gap:5px;
    padding-left:2.5rem;
    }    
nav li  {
    margin:0 10px 5px 0;
    font-size:smaller;
    background-color:beige;     
    padding:.1rem .2rem;
    border-radius: 5px;
    border:2px solid gold; 
    }
article {
    font-size: 1.4em;
    text-shadow: 2px 2px 8px #000000;
    place-self:center;
    }
    
/* main */
main {
    grid-column: 1/7;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(330px, auto));
    justify-content: center;
    padding-left:3px;
    }
.card {
    width: 300px;
    padding: 12px;
    color: #333;
    border: 1px solid #aaa;
    border-radius: 6px;
    margin-top: 12px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
.overlay {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(2px, auto);
    align-items: start;
    text-align:center;
    }
.cover {
    grid-column: 1;
    grid-row: 1;
    z-index: 1;
    }
.anthology {
    grid-column: 1;
    grid-row: 1;
    height: .9rem;
    background-color: rgba(24, 24, 24, 0.25);
    z-index: 2;
    color: #eee;
    font-size: 1rem;
    padding:5px 10px 10px 10px;
    }
.description {
    margin-top: 10px;
    font-size:smaller;
    }
.RNS {
   line-height:1.5em; 
   font-size: smaller;
   color:maroon;
   background-color:gold;
   padding:2px 15%;
   }  
footer {
    grid-column: 1/7;
    background-color: #eee;
    color: #555;
    margin: 1rem 0;
    padding:3px;
    text-align:center;
    border:solid #bbb;   
    border-width:1px 0px; 
    }