/* jadecss.css never resets the browser's default <ul> padding-left (40px, right stays 0), which
   made the nav content box 40px narrower on the left only - shifting the whole centered nav row
   20px right of true center (and, visually, out of alignment with the correctly-centered content
   below it, which made that content look shifted left by comparison even though it wasn't). */
header nav ul {
    padding: 0;
    margin: 0;
}

/* jadecss.css's shared "header li" rule gives every top-nav item a fixed 220px box, which is
   too narrow for the "Florida Civic Literacy Exam" label - its dark background (from jadecss.css's
   li background-image) was clipping short while the text overflowed past it. This drops that one
   item to its own row below the other nav buttons and lets its box size to the actual text. */
li.nav-fcle-btn {
    display: table;
    width: auto;
    padding: 0 16px;
    margin: 10px auto 0 auto;
}

/* Home page hero photo - replaces a dead hotlinked Facebook image. jadecss.css's global
   img{width:300px;height:300px} rule would squish this portrait shot into a square. This keeps
   the original's 300px width but sets height to scale exactly proportionally (768:1024 = 3:4
   source ratio, so 300px wide -> 400px tall) instead of being forced square. */
.site-hero-img {
    width: 300px;
    height: 400px;
}

/* jadecss.css sets background-repeat:no-repeat with background-size:100% (scales the texture to
   the page's width, height auto), which leaves a blank white gap once a page's content is taller
   than one image-height - increasingly obvious now that pages like the FAQ and flashcard screens
   run much longer. Repeating vertically keeps the texture continuous down the whole page. */
body {
    background-repeat: repeat-y;
}