/* //COLOR REFERENCE// */
.darkgray {
background-color: #333333;
}

.lessdarkgray {
background-color: #666;
}

.yellow {
background-color: #ffff00;
}

.muteyellow {
background-color: #85851f;
}
/* //BASIC LAYOUT// */

body {
font-family: 'Open Sans', sans-serif;
font-size: 100%;
font-weight: 400;
line-height: 130%;
margin: 0;
padding: 0;
flex-shrink: 0;
}

html, body {
height: 100%;
display: flex;
flex-direction: column;
}

.text-width, .front-page-main-text-width {
margin: 0 auto 0 auto;
max-width: 680px;
}


@media (max-width: 679px) {
.text-width {
margin-left: .5em;
margin-right: .5em;
max-width: 100%;
padding-left: .5em;
padding-right: .5em;
}
}/* // BASIC TEXT STYLING // */

p, li {
color: #525252;
font-family: Verdana, sans-serif;
font-size: 95%;
line-height: 125%;
}

li {
list-style: square;
margin-bottom: 2%;
margin-left: -3%;
}

a:link,  a:visited {
color: #A38300;
text-decoration: none;
}

a:hover {
color: #666;
text-decoration: underline;
}

.small {
font-family: 'Open Sans', sans-serif;
font-size: 80%;
font-weight: 300;
line-height: 140%;
margin: 0;
}

.underform {
font-family: 'Open Sans', sans-serif;
font-size: 80%;
text-align: center;
font-weight: 300;
line-height: 140%;
margin-left: auto;
margin-right: auto;
max-width: 100%;
width: 450px;
}

.small-heavier {
font-weight: 600;
}

blockquote {
background-color: #ececec;
margin: 2%;
padding: 3%;
}

.heavier {
font-weight: 600;
}

.right {
text-align: right;
}

.minor-head {
font-family: 'Open Sans', sans-serif;
font-size: 90%;
font-weight: 700;
padding-top: 2%;
margin-bottom: -4%;
}

.tags {
font-family: 'Open Sans', sans-serif;
font-size: 80%;
font-weight: 400;
line-height: 140%;
padding-top: 2%;
}

.unpublished {
color: #a30000;
font-family: 'Open Sans', sans-serif;
font-size: 90%;
font-weight: 400;
line-height: 140%;
margin: 0;
}

.news-item-post-date {
font-family: 'Open Sans', sans-serif;
font-size: 100%;
font-weight: 600;
margin: 2% 0 2% 0;
}

code {
color: red;
font-family: 'Lucida Console', Monaco, Courier, monospace;
background-color: #e3e3e3;
border: 1px solid #a8a8a8;
padding: 0 5px 0 5px;
}

/* // HEADINGS // */

h1, h2, h3, h4, h5, h6 {
color: #132331;
font-family: 'Open Sans', sans-serif;
}

h1 {
font-size: 2.5em;
font-weight: 400;
line-height: 1em;
margin-bottom: .5em;
margin-top: .5em;
padding: 0;
}

h2 {
font-size: 180%;
font-weight: 600;
line-height: 1em;
margin-bottom: .25em;
margin-top: 1em;
padding: 0;
}

h3 {
font-size: 140%;
font-weight: 600;
line-height: 1em;
margin-bottom: .25em;
margin-top: 1em;
padding: 0;
}

h4 {
font-size: 150%;
font-weight: 600;
line-height: 1.4em;
margin-bottom: .25em;
margin-top: 1em;
padding: 0;
}/* // note: used for book hook lines // */

h5 {
font-size: 140%;
font-weight: 700;
line-height: 1.3em;
margin-bottom: 1em;
margin-top: 0;
padding: 0;
}

h6 {
font-size: 110%;
font-weight: 600;
line-height: 1em;
margin-bottom: .25em;
margin-top: 1em;
padding: 0;
}/* // FRONT PAGE // */

#front-page-book-grid a, .inside-grid-square-container-right a {
text-decoration: none;
}

#front-page-book-grid .grid-square-container-3:hover, .inside-grid-square-container-right:hover {
background-color: #eee;
border-radius: 5px;
}

.front-page-grid-book-title {
color: #339;
font-family: 'Open Sans', sans-serif;
font-size: 135%;
font-weight: 600;
line-height: 100%;
margin: 0;
text-align: center;
}

.front-page-grid-book-description {
font-family: 'Open Sans', sans-serif;
font-size: 95%;
font-weight: 400;
line-height: 120%;
margin: 4% 0 3% 0;
padding-left: 5%;
padding-right: 5%;
}

.front-page-welcome {
color: #333;
font-family: 'Open Sans', sans-serif;
font-size: 120%;
font-weight: 600;
line-height: 120%;
margin-bottom: .25em;
margin-top: 1em;
padding: 0;
}

.small-right {
font-family: 'Open Sans', sans-serif;
font-size: 80%;
font-weight: 300;
margin: 0;
text-align: right;
}/* //FORM AND BUTTON// */

#join-form form {
margin-top: -30px;
}

#front-page form {
margin-top: -12px;
}

input {
border-color: #d9d9d9;
border-radius: 6px;
font-size: 1.5em;
max-width: 400px;
padding: .25em;
width: 90%;
}

label {
font-family: 'Open Sans', sans-serif;
font-size: 100%;
font-weight: 700;
margin-top: 1.5em;
padding-bottom: 0;
}

.button-block {
margin-bottom: 30px;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
max-width: 500px;
padding-left: 2%;
padding-right: 2%;
}

.button-link, #button-target {
font-family: 'Open Sans', sans-serif;
font-size: 170%;
text-align: center;
text-decoration: none;
}

.button-text, #button-target {
background-color: #132331;/* background-color: #333333;*/
border: 2px solid #333;
border-radius: 10px;
color: white;
padding: 10px;
}

.button-text:hover, #button-target:hover {
background-color: #666;
color: white;
}/* //LANDING PAGE// */

.white-box {
background-color: white;
border-radius: 10px;
opacity: .75;
padding: 1% 2% 1% 2%;
}

.holding-white-box {
padding-top: 1%;
}

.review-text {
color: #132331;
font-size: 140%;
margin-left: 10%;
margin-right: 10%;
font-style: italic;
}

.review-source {
text-align: right;
font-size: 110%;
margin-left: 15%;
margin-right: 15%;
margin-top: -3%;
}
/* //PAGE HEADER// */

#page-header {
margin-top: -21px;
}

.header-wide {
background-color: #333333;
}

.header-wide-simon-says {
background-color: #333333;
background-image: url(/images/logo/simon-says-background.png);
}

.header-logo-image {
margin-bottom: 3%;
margin-top: 8%;
}/* //PAGE FOOTER// */

#footer {
margin-top: 1%;
}

.flex {
flex-grow: 1;
}

#footer .foot-menu-text, #footer a:link, #footer a:visited {
color: #666;
font-family: 'Open Sans', sans-serif;
font-size: 105%;
font-weight: 400;
margin: 0;
padding: 0 0 5% 0;
text-align: center;
text-decoration: none;
}

#footer a:link:hover {
color: #ffff00;
}

.foot-wide {
background-color: #333333;
}

.foot-narrow-image {
margin-left: auto;
margin-right: auto;
width: 50%;
}

.footer-logo-image {
padding-top: 5%;
width: 100%;
}

/* // SOCIAL FOOTER ICONS // */

.social-buttons-container {
display: table;
margin: 0 auto 0 auto;
padding: 2% 0 2% 0;
}

.social-icons {
letter-spacing: 5px;
}

/* // FLEX GRID BLOCK BASICS // */

.grid-container-wrap {
display: flex;
flex-flow: wrap;
width: 100%;
}

.grid-container-nowrap {
display: flex;
flex-flow: nowrap;
width: 100%;
}

.grid-square-container-3, .grid-square-container-4, .grid-square-container-front-top-left, .grid-square-container-front-top-right {
margin-left: auto;
margin-right: auto;
}

.inside-grid-square-container-left, .inside-grid-square-container-right {
width: 100%;
}

.biblio-three {
width: auto;
height: 200px;
display: block;
margin: 0 auto;
}

.biblio-four {
width: auto;
height: 140px;
display: block;
margin: 0 auto;
}

.grid-item {
height: auto;
margin-left: 2%;
margin-top: 2%;
width: 96%;
}/* // GRID TWO-WAY RESIZING // */

@media all and (min-width: 680px) {
.grid-square-container-front-top-left {
width: 66%;
}

  .grid-square-container-front-top-right {
width: 33%;
}
}
@media all and (max-width:679px) and (min-width: 500px) {
.grid-square-container-front-top-left {
max-width: 100%;
}

  .grid-square-container-front-top-right {
width: 66%;
}
}

@media all and (max-width: 499px) {
.grid-square-container-front-top-left, .grid-square-container-front-top-right {
width: 100%;
}
}
/* //FRONT PAGE COVERS// */
@media all and (min-width: 680px) {
.front-page-cover {
width: auto;
height: 330px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 650px) and (max-width:679px) {
.front-page-cover {
width: auto;
height: 300px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 600px) and (max-width:649px) {
.front-page-cover {
width: auto;
height: 280px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 550px) and (max-width:599px) {
.front-page-cover {
width: auto;
height: 250px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 500px) and (max-width:549px) {
.front-page-cover {
width: auto;
height: 220px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 450px) and (max-width:499px) {
.front-page-cover {
width: auto;
height: 300px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 400px) and (max-width:449px) {
.front-page-cover {
width: auto;
height: 260px;
display: block;
margin: 0 auto;
}
}

@media all and (min-width: 350px) and (max-width:399px) {
.front-page-cover {
width: auto;
height: 220px;
display: block;
margin: 0 auto;
}
}

@media all and (max-width:349px) {
.front-page-cover {
width: auto;
height: 180px;
display: block;
margin: 0 auto;
}
}

/* // BOOK GRID THREE-WAY RESIZING // */

@media all and (min-width: 630px) {
.grid-square-container-3 {
width: 33%;
}

.biblio-three {
width: auto;
height: 300px;
display: block;
margin: 0 auto;
}
}
  @media all and (max-width:629px) and (min-width: 500px) {
.grid-square-container-3 {
width: 33%;
}

.biblio-three {
width: auto;
height: 200px;
display: block;
margin: 0 auto;
}
}

@media all and (max-width: 499px) and (min-width: 320px) {
.grid-square-container-3 {
width: 48%;
}

.biblio-three {
width: auto;
height: 200px;
display: block;
margin: 0 auto;
}
}

@media all and (max-width: 319px) {
.grid-square-container-3 {
width: 48%;
}

.biblio-three {
width: auto;
height: 140px;
display: block;
margin: 0 auto;
}
}/* // BOOK GRID FOUR-WAY RESIZING // */

@media all and (min-width: 500px) {
.grid-square-container-4 {
width: 23%;
}

.biblio-four {
width: auto;
height: 140px;
display: block;
margin: 0 auto;
}
}

@media all and (max-width: 499px) {
.grid-square-container-4 {
width: 48%;
}

.biblio-four {
width: auto;
height: 140px;
display: block;
margin: 0 auto;
}
}/* // IMAGE HANDLING // */

figure {
margin: 0;
}

.book-microdata {
padding-bottom: 2%;
}

.cover-image {
width: 100%;
}

.book-page-cover, .author-picture-container {
height: auto;
min-width: 100px;
padding: 2px;
width: 35%;
}

.thin-border {
border: 1px;
border-color: silver;
border-style: solid;
}

.float-right {
float: right;
margin-bottom: 5px;
margin-left: 10px;
}/* // BIBLIOGRAPHY // */

.bibliography-book-title {
margin: 0;
text-align: center;
}

.bibliography-detail-block {
font-family: 'Open Sans', sans-serif;
font-weight: 300;
line-height: 140%;
margin: 2% 0 1% 0;
}

@media all and (max-width: 499px) {
.bibliography-book-title {
font-size: 110%;
}

  .bibliography-detail-block {
font-size: 65%;
}
}

@media all and (min-width: 500px) {
.bibliography-book-title {
font-size: 150%;
}

  .bibliography-detail-block {
font-size: 80%;
}
}

.bibliography-title-link {
text-decoration: none;
}

.bibliography-series-number {
color: #4c4c4c;
font-family: 'Open Sans', sans-serif;
font-size: 90%;
font-weight: 700;
margin: 1% 0 1% 0;
text-align: center;
}/* //SIMON SAYS// */

h1.shout-line {
  font-size: 300%;
  font-weight: 800;
  line-height: 100%;
  text-align: center;
}

#simon-says-content h1 {
border-top: 1px solid;
margin-top: 15%;
padding-top: 2%;
text-align: center;
}

#simon-says-content h2 {
border-bottom: 1px solid;
margin-top: 5%;
padding-bottom: 1%;
}

#simon-says-content h3 {
font-size: 150%;
}

#simon-says-content h4 {
font-size: 130%;
font-style: italic;
}

/* note: the Simon Says blockquote style has been superceded by .simon-says-pull-quote */
#simon-says-content blockquote {
border-left: 10px solid #132331;
background-color: #ffffff;
font-family: monospace;
font-size: 175%;
font-weight: bold;
margin: 2% 2% 2% 5%;
padding: 2%;
}

.simon-says-pull-quote {
border-left: 10px solid #132331;
background-color: #ffffff;
font-family: monospace;
font-size: 150%;
font-weight: bold;
margin: 2% 2% 2% 5%;
padding: 2%;
}

.simon-says-index-head-span {
font-size: 140%;
}

.simon-says-index-edition-span {
color: #132331;
font-family: 'Open Sans', sans-serif;
font-weight: 600;
}

.simon-says-index-padding {
margin-top: 4%;
}

.email-shout-line {
font-family: 'Open Sans', sans-serif;
font-size: 110%;
font-style: italic;
font-weight: 400;
line-height: 125%;
margin-bottom: 0;
margin-left: 10%;
margin-right: 10%;
margin-top: 0;
text-align: center;
width: 80%;
}

.email-figure-caption {
font-family: 'Open Sans', sans-serif;
font-size: 110%;
font-style: italic;
font-weight: 400;
line-height: 125%;
margin-bottom: 0;
margin-left: 10%;
margin-right: 10%;
margin-top: 2%;
text-align: center;
width: 80%;
}

.email-figure-image {
width: 100%;
}/* //LIST VIEWS// */

.book-in-series-details {
width: 100%;
}

#news-feed-list h5 {
color: #525252;
font-family: Verdana, sans-serif;
font-size: 95%;
line-height: 125%;
font-weight: 400;
}

.news-feed-list-date {
font-family: 'Open Sans', sans-serif;
font-size: 90%;
font-weight: 400;
margin: 0 0 2% 0;
}

.book-in-series-cover, .news-feed-item-image {
height: auto;
margin-right: 1%;
min-width: 100px;
width: 35%;
}

.book-in-series-cover-figure, .news-feed-item-figure {
border: silver 1px solid;
width: 100%;
}

.book-in-series-details, .news-feed-item-details {
width: 100%;
}

.book-in-series-container, .news-feed-item-container {
display: flex;
margin-bottom: 2%;
}

.news-feed-item-head {
padding-top: 0;
margin-top: 0;
}

.book-data {
margin-bottom: 2%;
margin-top: 0;
}

.book-in-series-book-title {
margin: 0 0 1% 0;
padding: 0;
}

.book-in-series-title-link {
text-decoration: none;
}

.book-series-number {
color: #4c4c4c;
font-family: 'Open Sans', sans-serif;
font-size: 120%;
font-weight: 700;
margin: 0 0 1% 0;
}

/* // WOTL POSTS // */

h1.wotl-post-title {
font-size: 2.5em;
font-weight: 400;
line-height: 1em;
margin-bottom: 1%;
margin-top: .5em;
padding: 0;
}

p.wotl-date {
padding: 0;
margin: 0;
}

#list-title-link a:link {
color: #132331;
text-decoration: none;
}

#list-title-link a:hover {
color: #666;
text-decoration: underline;
}

/* // WOTL PAGE TOC // */

#wotl-page-toc ul {
padding-top: 1%;
}

#wotl-page-toc li {
list-style: none ;
margin-left: -40px;
margin-bottom: 1%;
}

#wotl-page-toc ul > li > ul > li {
list-style: square ;
margin-left: -20px;
margin-bottom: 1%;
}

@media all and (min-width:420px) {
.toc {
border: 3px double #132331;
padding: 0 2% 0 2%;
margin: 2% 0 3% 2%;
width: 40%;
float: right;
}
}

@media all and (max-width:419px) {
.toc {
border: 3px double #132331;
padding: 0 2% 0 2%;
margin-top: 2%;
width: 96%;
float: none;
}
}

/* //TAXONOMY LISTS// */

p.taxon-head {
font-size: 140%;
margin-bottom: -2%;
padding-bottom: 0;
}
p.taxon-list {
margin-bottom: .5%;
}
#taxon-list li {
list-style: none ;
margin-left: -40px;
}
.lowercase {
text-transform: lowercase; 
}

/* //PAGINATION// */

.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
@media all and (max-width:419px) {
.pagination {
font-size: 80%;
}
}
.pagination > li {
display: inline;
}
.pagination > li > a, .pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #132331;
text-decoration: none;
background-color: #fff;
border: 1px solid #ddd;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eee;
border-color: #ddd;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
z-index: 3;
color: #fff;
cursor: default;
background-color: #132331;
border-color: #132331;
}
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
color: #777;
cursor: not-allowed;
background-color: #fff;
border-color: #ddd;
}
.pagination-lg > li > a, .pagination-lg > li > span {
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
}
.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span {
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.pagination-sm > li > a, .pagination-sm > li > span {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
}
.pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}