/*
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #222;
font-family: 'libre_baskervilleregular', 'Times New Roman', sans-serif;
}
label {
cursor: pointer;
}
body {
font-size: 1em;
line-height: 1.4;
}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate.
* Customize the background color to match your design.
*/
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/*
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
*/
img {
vertical-align: middle;
}
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
/*
* Custom input and textarea
*/
input[type=text],
input[type=password],
textarea {
font-family: 'libre_baskervilleregular', 'Times New Roman', sans-serif;
-webkit-box-shadow: .025em .025em .125em .125em #ccc;
-moz-box-shadow: .025em .025em .125em .125em #ccc;
box-shadow: .025em .025em .125em .125em #ccc;
-moz-border-radius: .125em;
-webkit-border-radius: .125em;
border-radius: .125em;
}
input[type=text]:focus,
input[type=password]:focus,
textarea:focus {
-webkit-box-shadow: .05em .05em .1em .125em #60add2;
-moz-box-shadow: .05em .05em .1em .125em #60add2;
box-shadow: .05em .05em .1em .125em #60add2;
}
/* ==========================================================================
Chrome Frame prompt
========================================================================== */
.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
/* ==========================================================================
Author's custom styles
========================================================================== */
/* Cursors */
.cursorpointer {
cursor: pointer;
}
/* Paddings */
.paddingbottom0_5em {
padding-bottom: 0.5em;
}
/* Margins */
.marginauto {
margin: auto;
}
.marginbottom1em {
margin-bottom: 1em;
}
.margintopbottom2em {
margin: 2em 0 2em 0;
}
/* Widths */
.width100pc {
width: 100%;
height: auto;
}
.maxwidth100pc {
max-width: 100%;
height: auto;
}
/*display and floats*/
.floatleft {
float: left;
}
.floatright {
float: right;
}
.displayinline {
display: inline;
}
.displayinlinenlock {
display: inline-block;
}
.displayblock {
display: block;
}
.displaynone {
display: none;
}
/* borders */
.borderbottomCCC {
border-bottom: 1px solid #ccc;
-webkit-box-shadow: 0 0.75em 1em -0.5em rgba(204, 204, 204, 1);
-moz-box-shadow: 0 0.75em 1em -0.5em rgba(204, 204, 204, 1);
box-shadow: 0 0.75em 1em -0.5em rgba(204, 204, 204, 1);
padding-bottom: 0.5em;
}
/* audio */
.audio-advert {
display: none;
position: fixed;
bottom: 0;
right: 0;
min-width: 26em;
z-index: 100;
max-width: 100%;
text-align: left;
background: #fff;
border: 2px;
border-top-left-radius: 1em;
border-left: 2px solid #C2C2C2;
border-top: 2px solid #C2C2C2;
}
html.js .audio-advert {
display: block;
}
.audio-advert img {
max-width: 30%;
float: left;
margin: 0.5em;
border: 2px solid #C2C2C2;
}
.audio-player-responsive-wrapper {
width: 100%;
margin: auto;
text-align: center;
display: block;
}
.audio-player-wrapper {
width: 100%;
max-width: 100%;
float: left;
clear: both;
border: 1px solid #949494;
-webkit-box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.64);
-moz-box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.64);
box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.64);
}
.audio-advert-close {
float: right;
padding: 0.25em;
font-family: Arial, sans-serif;
font-weight: bold;
cursor: pointer;
}
.audioplayer-bar {
display: none;
}
/* TYPOGRAPHY */
/* font size
* Sets up some sensible default typography. *
Based on the typography.css portion of Blueprint CSS @ http://blueprintcss.org/
Pixels EMs Percent
2px 0.125em 12.5%
4px 0.25em 25.0%
5px 0.3125em 31.25%
6px 0.375em 37.5%
7px 0.438em 43.8%
8px 0.5em 50%
9px 0.563em 56.3%
10px 0.625em 62.5%
11px 0.688em 68.8%
12px 0.75em 75%
13px 0.813em 81.3%
14px 0.875em 87.5%
15px 0.938em 93.8%
--------------------------
16px 1em 100%
--------------------------
17px 1.063em 106.3%
18px 1.125em 112.5%
19px 1.188em 118.8%
20px 1.25em 125%
21px 1.313em 131.3%
22px 1.375em 137.5%
23px 1.438em 143.8%
24px 1.5em 150%
25px 1.5625em 156.25%
26px 1.625em 162.5%
27px 1.6875em 168.75%
32px 2em 200%
35px 2.1875em 218.75% */
.fontsize6px {
font-size: 0.375em;
}
.fontsize7px {
font-size: 0.438em;
}
.fontsize8px {
font-size: 0.5em;
}
.fontsize9px {
font-size: 0.563em;
}
.fontsize10px {
font-size: 0.625em;
}
.fontsize11px {
font-size: 0.688em;
}
.fontsize12px {
font-size: 0.75em;
}
.fontsize13px {
font-size: 0.813em;
}
.fontsize14px {
font-size: 0.875em;
}
.fontsize15px {
font-size: 0.938em;
}
.fontsize16px {
font-size: 1em;
}
.fontsize17px {
font-size: 1.063em;
}
.fontsize18px {
font-size: 1.125em;
}
.fontsize19px {
font-size: 1.188em;
}
.fontsize20px {
font-size: 1.25em;
}
.fontsize21px {
font-size: 1.313em;
}
.fontsize22px {
font-size: 1.375em;
}
.fontsize23px {
font-size: 1.438em;
}
.fontsize24px {
font-size: 1.5em;
}
.fontsize26px {
font-size: 1.625em;
}
.fontsize28px {
font-size: 1.750em;
}
.fontsize32px {
font-size: 2em;
}
/* #Font faces
================================================== */
@font-face {
font-family: 'libre_baskervilleregular';
src: url('../fonts/librebaskerville/librebaskerville-regular-webfont.eot');
src: url('../fonts/librebaskerville/librebaskerville-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/librebaskerville/librebaskerville-regular-webfont.woff2') format('woff2'),
url('../fonts/librebaskerville/librebaskerville-regular-webfont.woff') format('woff'),
url('../fonts/librebaskerville/librebaskerville-regular-webfont.ttf') format('truetype'),
url('../fonts/librebaskerville/librebaskerville-regular-webfont.svg#libre_baskervilleregular') format('svg');
font-weight: normal;
font-style: normal;
}
.libre_baskervilleregular {
font-family: 'libre_baskervilleregular', 'Times New Roman', sans-serif;
}
@font-face {
font-family: 'libre_baskervillebold';
src: url('../fonts/librebaskerville/librebaskerville-bold-webfont.eot');
src: url('../fonts/librebaskerville/librebaskerville-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/librebaskerville/librebaskerville-bold-webfont.woff2') format('woff2'),
url('../fonts/librebaskerville/librebaskerville-bold-webfont.woff') format('woff'),
url('../fonts/librebaskerville/librebaskerville-bold-webfont.ttf') format('truetype'),
url('../fonts/librebaskerville/librebaskerville-bold-webfont.svg#libre_baskervillebold') format('svg');
font-weight: normal;
font-style: normal;
}
.libre_baskervillebold {
font-family: 'libre_baskervillebold', 'Times New Roman', sans-serif;
}
@font-face {
font-family: 'texgyrebonumbold';
src: url('../fonts/texgyrebonum/texgyrebonum-bold-webfont.eot');
src: url('../fonts/texgyrebonum/texgyrebonum-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/texgyrebonum/texgyrebonum-bold-webfont.woff') format('woff'),
url('../fonts/texgyrebonum/texgyrebonum-bold-webfont.ttf') format('truetype'),
url('../fonts/texgyrebonum/texgyrebonum-bold-webfont.svg#texgyrebonumbold') format('svg');
font-weight: normal;
font-style: normal;
}
.texgyrebonumbold {
font-family: 'texgyrebonumbold', 'Arial', sans-serif;
}
.italic {
font-style: italic;
}
.whitespacenowrap {
white-space: nowrap;
}
/* Headings */
h1,
h2,
h3,
h4 {
line-height: 1.125em;
}
h1 {
color: #d45602;
font-family: 'texgyrebonumbold', 'Arial', sans-serif;
font-size: 2em;
margin: 1em 0 1em 0;
text-align: center;
text-shadow:
0 -1px 0 rgba(253, 202, 93, .5),
0 1px 0 rgba(0, 0, 0, .8);
}
h2,
h3,
h4,
h5,
h6,
.index-entry {
font-family: 'texgyrebonumbold', 'Arial', sans-serif;
text-shadow:
0 -1px 0 rgba(221, 208, 203, .5),
0 1px 0 rgba(0, 0, 0, .2);
}
#index h1 {
font-size: 3em;
margin: .5em 0 .75em 0;
}
h2 {
color: #B53801;
font-size: 1.625em;
}
h3 {
color: #992F01;
font-size: 1.5em;
}
h4,
h5,
h6,
.index-entry {
color: #992F01;
font-size: 1.375em;
}
#news-lists h2 {
white-space: nowrap;
font-size: 1.25em;
}
/* Text alignment */
.text-align-left {
text-align: left;
}
.text-align-center {
text-align: center;
text-indent: 0;
}
.text-align-right {
text-align: right;
}
.text-align-justify {
text-align: left;
}
.verticalaligntop {
vertical-align: top;
}
.verticalalignbottom {
vertical-align: bottom;
}
.verticalalignmiddle {
vertical-align: middle;
}
/* font formatting */
.bold {
font-weight: bold;
}
.white {
color: #fff;
}
.red {
color: #E44D26;
}
.blue {
color: #2A579A;
}
.orange {
color: #ff8800;
}
.dark-orange {
color: #e44d26;
}
.grey {
color: #b2bcc3;
}
.highlight {
background-color: #FDB483;
-webkit-box-shadow: 0 0 1em 0.5em rgba(253, 180, 131, 1);
-moz-box-shadow: 0 0 1em 0.5em rgba(253, 180, 131, 1);
box-shadow: 0 0 1em 0.5em rgba(253, 180, 131, 1);
-webkit-border-radius: .25em;
-moz-border-radius: .25em;
border-radius: .25em;
}
/* Blockquotes */
blockquote:before {
display: block;
height: 0;
content: "\201C";
font-family: 'texgyrebonumbold', 'Arial', sans-serif;
font-size: 3.5em;
margin-left: -1.125em;
font-style: italic;
color: #999;
}
blockquote,
.critique {
width: auto;
display: table;
background: #fff;
line-height: 1.5em;
color: #777;
margin: 0 auto 1em auto;
padding: 0.5em 1em;
border-left: 0.5em solid #ddd;
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
}
blockquote footer.citation {
display: block;
font-size: 0.875em;
font-style: italic;
color: #555;
}
blockquote footer.citation:before {
content: "\2014 \0020";
}
blockquote footer.citation a,
blockquote footer.citation a:visited,
blockquote footer.citation a:visited {
color: #555;
}
/* Horizontal Rules */
hr {
font-size: 0.75em;
overflow: visible; /* For IE */
width: 60%;
height: 2em;
margin: 2em auto 0 auto;
padding: 0;
border: none;
border-top: medium double #719CB1;
color: #366176;
text-align: center;
text-shadow:
0 0 0.125em #ccc,
0 0 0.125em #ccc,
0 0 0.125em #ccc;
box-shadow: inset 0 0.25em 0.25em -0.25em rgba(0, 12, 204, 0.5);
}
hr:after {
font-family: FontAwesome;
content: "\f185";
display: inline-block;
position: relative;
top: -0.813em;
font-size: 1.5em;
padding: 0 0.25em;
background: #fbfbf8;
}
/* GDPR Cookie classes */
#cookie-gdpr {
display: none;
position: fixed;
bottom: 1.5em;
left: 1.5em;
z-index: 999999;
width: 22em;
background-color: rgb(45, 56, 74);
padding: 1em;
color: rgb(255, 255, 255);
text-align: justify;
font-family: 'libre_baskervilleregular', 'Times New Roman', sans-serif;
line-height: 1.5em;
box-shadow: rgb(0, 0, 0) 0px 0px 0.5em;
border: 0.125em solid rgb(255, 102, 0);
border-radius: 0.3125em;
}
#cookie-gdpr .cookie-accept, #cookie-gdpr .cookie-manage {
display: inline-block;
float: right;
background-color: rgb(255, 102, 0);
cursor: pointer;
padding: 0.375em 0.625em;
font-weight: bold;
margin: 0.75em 0.3125em 0.75em 0;
transition: 0.25s;
text-shadow: rgb(0, 0, 0) 0 0 0.125em;
color: rgb(255, 255, 255);
border-radius: 0.3125em;
border: none;
}
#cookie-gdpr .cookie-manage {
background-color: rgb(45, 56, 74);
float: left;
}
#cookie-manager {
margin: 1em 0;
padding: 0 1.5em;
background: #fff;
-webkit-box-shadow: .025em .025em .125em .125em #ccc;
-moz-box-shadow: .025em .025em .125em .125em #ccc;
box-shadow: .025em .025em .125em .125em #ccc;
}
/* Published works download page donation request box */
#donation-request {
display: none;
margin-top: 1em;
overflow: auto;
padding: 0.5em;
background: #2d384a;
color: #ffffff;
border: 2px solid #FC6A08;
-moz-border-radius: .25em;
-webkit-border-radius: .25em;
border-radius: .25em;
}
#donation-request form {
float: right;
padding-right: 2em;
padding-top: 0.5em;
vertical-align: middle;
}
#donation-request .col-25 input {
width: 80%;
max-width: 80%;
}
#donation-request .donation-emphasis {
color: #FF9D00;
}
#donation-request .donate-select {
color: #22B70E;
font-size: 2em;
padding-top: 0.125em;
text-shadow:
0 0 1px #000,
0 0 1px #000,
0 0 1px #000;
}
#donation-request a:link,
#donation-request a:visited,
#donation-request li.current a,
#donation-request li.current a:visited {
color: #0E97D6;
font-weight: bold;
}
/* #Lists
================================================== */
#wrapper-inner ol {
list-style: decimal;
}
#wrapper-outer.poem ol ul {
list-style: none;
margin: 0;
}
#wrapper-outer.poem ol ul > li {
text-indent: -0.875em;
}
#wrapper-outer.poem ol ul > li:before {
content: "- ";
text-indent: -0.875em;
}
/* Links
================================================== */
a:link {
text-decoration: none;
/* These are technically the same, but use both */
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
/* This is the dangerous one in WebKit, as it breaks things wherever */
word-break: break-all;
/* Instead use this non-standard one: */
word-break: break-word;
/* Adds a hyphen where the word breaks, if supported (No Blink) */
-ms-hyphens: auto;
-moz-hyphens: auto;
webkit-hyphens:auto;
-webkit-hyphenate-character:"\2010";
-webkit-hyphenate-limit-after:1;
-webkit-hyphenate-limit-before:3;
hyphens: auto;
}
/* add to empty spans inside links to make that link fill a div */
.linkfill {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 100;
}
/* Paragraph Styles
================================================== */
p.tight {
margin-top: 0em;
margin-bottom: 0em;
}
/* Rotate
================================================== */
.rotateminus1dg {
-webkit-transform: rotate(-1deg);
-moz-transform: rotate(-1deg);
-o-transform: rotate(-1deg);
transform: rotate(-1deg);
}
.rotateplus1dg {
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
-o-transform: rotate(1deg);
transform: rotate(1deg);
}
/* Hover animations
================================================== */
.hovergrow {
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
-ms-transition: .2s;
transition: .2s;
}
/* grow on hover*/
.hovergrow:hover {
-webkit-transform: scale(1.075);
-moz-transform: scale(1.075);
-o-transform: scale(1.075);
transform: scale(1.075);
}
/*Misc
================================================== */
.menu-respond {
display: none;
}
.menu-respond-mobile {
display: none;
}
.mobile-show {
display: block;
}
/* #Images
================================================== */
img.scale-with-grid {
max-width: 100%;
height: auto;
}
/* ==========================================================================
Helper classes
========================================================================== */
/*
* Image replacement
*/
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 100%;
}
/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/
.hidden {
display: none !important;
visibility: hidden;
}
/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
/*
* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
/*
* Hide visually and from screenreaders, but maintain layout
*/
.invisible {
visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
#archive ul:before,
#archive ul:after,
.clearfix:before,
.clearfix:after {
content: " ";
/* 1 */
display: table;
/* 2 */
}
#archive ul:after,
.clearfix:after {
clear: both;
}
.clearboth,
#archive ul {
clear: both;
}
/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
#archive ul,
.clearfix {
*zoom: 1;
}
/* #Mobile First Styles
============================================================== */
body {
background-image: url('../pics/header-footer-background.jpg');
background-position: center top;
}
#container {
width: 100%;
}
#header {
background-color: #2D384A;
background-position: bottom;
position: fixed;
z-index: 99;
top: 0;
width: 100%;
-o-box-shadow: 0 0 0.75em #979797;
-webkit-box-shadow: 0 0 0.75em #979797;
-moz-box-shadow: 0 0 0.75em #979797;
box-shadow: 0 0 0.75em #979797;
border-bottom: 2px solid #fc6a08;;
}
html.no-js #header {
position: static;
}
#logo {
position: absolute;
height: 3.75em;
width: 4em;
background-image: url('../pics/logo.png');
-webkit-background-size: auto 100%;
-moz-background-size: auto 100%;
-o-background-size: auto 100%;
background-size: auto 100%;
background-repeat: no-repeat;
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
-ms-transition: .2s;
transition: .2s;
z-index: 99;
}
#logo:hover {
background-image: url('../pics/logo-hover.png');
}
#logo-text {
display: none;
position: absolute;
left: 70px;
top: 8px;
line-height: 1em;
font-family: 'texgyrebonumbold', 'Arial', sans-serif;
z-index: 1;
}
#logo-text-top {
font-size: 1em;
}
#logo-text-bottom {
font-size: 0.875em;
}
#logo-text a:link,
#logo-text a:visited {
color: #fff;
text-decoration: none;
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
-ms-transition: .2s;
transition: .2s;
}
#logo-text a:hover,
#logo-text a:visited:hover,
#toggle a:hover,
#togglemenu li a:hover,
#togglemenu li.current a:hover {
color: #ffac46;
text-shadow: 0 0 0.2em #ff6600,
0 0 0.2em #ff6600,
0 0 0.2em #ff6600;
}
#nav {
margin: auto;
max-width: 85.375em;
min-height: 50px;
text-align: center;
}
#nav ul {
list-style: none;
margin: 0;
}
#nav li {
line-height: 50px;
height: 100%;
z-index: 98;
margin: -1px -5px 0 0;
}
#togglemenu {
position: absolute;
z-index: 0;
top: 3.188em;
left: 0;
right: 0;
border-bottom: 2px solid #fc6a08;
background-color: #2D384A;
}
#toggle a:link,
#toggle a:visited {
color: #fff;
}
#togglemenu a:link,
#togglemenu a:visited,
#togglemenu li.current a,
#togglemenu li.current a:visited {
font-size: 1.25em;
color: #fff;
font-family: 'libre_baskervilleregular', 'Times New Roman', sans-serif;
font-variant: small-caps;
font-weight: 700;
text-decoration: none;
display: inline-block;
padding: 0 0.5em 0 0.5em;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
-ms-transition: .3s;
transition: .3s;
margin: 0;
}
#togglemenu li.current a,
#togglemenu li.current a:visited {
color: #ffa53f;
}
#content {
margin-top: 2.75em;
width: 100%;
background-color: #fbfbf8;
}
html.no-js #content {
margin-top: 0;
border-top: 2px solid #ccc;
}
html.no-js #toggle {
display: none;
}
html.js #toggle {
display: block;
position: absolute;
top: 0;
right: 0.5em;
}
html.js #togglemenu {
display: none;
}
html.no-js #logo {
display: none;
}
html.no-js #togglemenu {
top: 0;
z-index: 0;
}
html.no-js #togglemenu li {
display: inline-block;
}
html.no-js .no-js-hide, html.js .no-js-show {
display: none;
}
html.js .no-js-hide, html.no-js .no-js-show {
display: inline-block;
}
.menu-toggle {
font-size: 1.125em;
}
html.no-js #banner-admin {
display: none;
}
#banner-admin {
margin-top: -1em;
height: 10em;
background-position: 50% 0;
width: 100%;
background-attachment: fixed;
border-bottom: 1px solid #362D24;
}
#banner-admin.background-about {
background-image: url('../pics/background-about-small.jpg');
}
#wrapper-outer {
width: 100%;
}
#wrapper-outer.poem h2,
#wrapper-outer.poem h3,
#wrapper-outer.poem h4,
#wrapper-outer.poem h5 {
margin-top: 1.5em;
}
#wrapper-outer.poem span.play-char,
#wrapper-outer.poem span.play-char-list {
font-family: 'libre_baskervillebold', 'Times New Roman', sans-serif;
color: #4D4C62;
font-weight: bold;
font-size: 1.25em;
font-variant: small-caps;
margin-right: 0.5em;
}
#wrapper-outer.poem span.play-char:after {
content: ": ";
}
#wrapper-outer.poem span.line-number {
float: right;
font-weight: bold;
color: #4D4C62;
}
#wrapper-outer.poem span.line-number:before {
content: "[";
}
#wrapper-outer.poem span.line-number:after {
content: "]";
}
#wrapper-outer.poem span.spacer,
#wrapper-outer.poem span.spacer-1,
#wrapper-outer.poem span.spacer-2,
#wrapper-outer.poem span.spacer-3,
#wrapper-outer.poem span.spacer-4 {
display: inline-block;
width: 0.125em;
}
#wrapper-outer.poem p {
text-indent: 0;
margin: 0.375em 0;
}
#wrapper-outer.poem p.line-break,
#wrapper-outer.poem p:empty {
display: block;
min-height: 1em;
}
#wrapper-outer.poem p.no-indent-dc,
#wrapper-outer.poem p.no-indent {
text-indent: 0;
}
#wrapper-outer.poem p.no-indent-dc:first-letter, #wrapper-outer p.no-indent-dc:first-letter {
float: left;
color: #d45602;
font-style: normal;
font-size: 3.75em;
margin: 0.188em 0.125em 0 0;
line-height: 0.7em;
height: 0.7em;
font-family: Georgia;
}
#wrapper-outer.poem p.indent-hang-dc:first-letter {
color: #d45602;
font-style: normal;
font-size: 2.5em;
font-family: Georgia;
margin: 0 0.063em 0 0;
float;
left;
}
#wrapper-outer.poem p.indent-hang,
#wrapper-outer.poem p.indent-hang-dc {
padding-left: 1.5em;
text-indent: -1.5em;
}
#wrapper-outer.poem img,
.fb-image img {
margin: 1em auto;
max-width: 100%;
border: 1px solid #949494;
-webkit-box-shadow: 0 0 1.5em 0 rgba(0, 0, 0, 0.64);
-moz-box-shadow: 0 0 1.5em 0 rgba(0, 0, 0, 0.64);
box-shadow: 0 0 1.5em 0 rgba(0, 0, 0, 0.64);
}
#wrapper-outer.poem img.no-img-decoration,
#wrapper-outer.poem img.text-page {
max-width: 100%;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
#wrapper-outer.poem img.no-img-decoration {
margin: 0;
border: none;
}
#wrapper-outer.poem img.text-page {
margin: 1em auto;
border: 1px dashed #949494;
}
html.js #content img.img-magnify,
html.js #content .book-cover,
html.js #content .text-page {
cursor: pointer;
}
#wrapper-inner {
background-color: #fbfbf8;
font-family: 'libre_baskervilleregular', 'Times New Roman', sans-serif;
line-height: 2em;
margin: auto;
padding: 0.063em 2.5em 2em 1.5em;
max-width: 85.375em;
}
/* Always align paragraph text left in mobile view */
.default-style p {
text-align: left;
}
.default-style .text-align-center,
.default-style .text-align-center p {
text-align: center;
}
.default-style .text-align-right,
.default-style .text-align-right p {
text-align: right;
}
/* Correct class="text-align-center" and align="right" elements from being justified/left-aligned by over-riding style rules */
#wrapper-inner [class="text-align-center"] {
text-align: center;
}
#wrapper-inner [align="right"] {
text-align: right;
}
#news #content a:link[href]:not(.button), .default-style a:link[href]:not(.button) {
font-family: "libre_baskervillebold", Arial, sans-serif;
color: #366176;
}
#news #content a:visited[href]:not(.button), .default-style a:visited[href]:not(.button) {
color: #704158;
}
#news #content a:link:hover[href]:not(.button), .default-style a:link:hover[href]:not(.button), .default-style a:visited:hover[href]:not(.button) {
color: #ff6600;
border-bottom: 1px dotted #ff6600;
cursor: pointer;
}
.default-style ul {
padding: 0 0 0 1em;
}
.default-style ol li {
padding-bottom: 0.75em;
}
.default-style li {
line-height: 1.5em;
}
ul.content-list {
list-style: none;
margin: 0.5em 0 2.5em 0.5em;
}
ul.content-list li {
margin: 0.5em 0;
}
.default-style ul.site-links {
padding: 0;
}
.default-style ul.site-links-index {
padding-bottom: 0.5em;
}
ul.site-links,
ul.news-list,
ul.site-links-index {
list-style: none;
}
ul.site-links {
margin: 2.5em auto 1.5em auto;
text-align: center;
}
ul.site-links-index > li {
line-height: 1.75em;
font-size: 1.125em;
padding: 0.75em 0 0.75em 2.5em;
}
ul.site-links-index > li:before {
font-family: FontAwesome;
margin: 0 0.5em 0 -1.2em;
color: #6C6C6C;
}
ul.site-links-index.arrows > li {
background: url('../pics/bullet-arrow.png') no-repeat left 1.5em;
}
li.site-links-index-book:before {
content:"\f02d";
}
li.site-links-index-newspaper:before {
content:"\f1ea";
}
li.site-links-index-user:before {
content:"\f2bd";
}
li.site-links-index-envelope:before {
content:"\f003";
}
li.site-links-index-search:before {
content:"\f002";
}
li.site-links-index-link:before {
content:"\f0c1";
}
li.site-links-index-paypal:before {
content:"\f1ed";
}
ul.site-links li {
width: 80%;
display: block;
text-align: center;
margin: 1.5em auto;
height: 2.5em;
}
#archive ol {
list-style-type: none;
list-style-type: decimal !ie;
/*IE 7- hack*/
margin: 0;
margin-left: 3em;
padding: 0;
counter-reset: li-counter;
}
#archive ol > li {
position: relative;
margin: 1em 0 1em 2.5em;
padding-left: 0.5em;
min-height: 3em;
border-left: medium double #CCCCCC;
}
#archive ol > li:before {
position: absolute;
top: 0;
left: -1.5em;
width: 0.25em;
font-size: 2.25em;
line-height: 1.75em;
font-weight: bold;
text-align: right;
color: #999999;
content: counter(li-counter);
counter-increment: li-counter;
}
ul.news-list {
clear: both;
font-size: 0.875em;
}
#archive ul li,
#archive ol {
background-color: #FFFCF3;
display: inline-block;
vertical-align: middle;
width: 92%;
background-image: url('../pics/panel-background.jpg');
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
padding: 0 1em 0 1em;
margin: 1em 1em 1em 0;
-o-box-shadow: 0 0 0.75em #979797;
-webkit-box-shadow: 0 0 0.75em #979797;
-moz-box-shadow: 0 0 0.75em #979797;
box-shadow: 0 0 0.75em #979797;
-webkit-transition: background 0.2s linear;
-moz-transition: background 0.2s linear;
-o-transition: background 0.2s linear;
-ms-transition: background 0.2s linear;
transition: background 0.2s linear;
}
#archive ul li:nth-child(even) {
background-position: center right;
}
#archive ul p {
clear: both;
}
#upload #file-list {
font-size: 0.875em;
margin-top: 1.5em;
height: 20em;
max-height: 20em;
overflow-y: auto;
list-style: none;
}
#upload #file-list li {
margin: 0.5em 0;
border-bottom: 1px solid #bcbcbc;
}
label.file-upload-label input[type="file"] {
position: fixed;
top: -1000px;
}
.file-upload-label:invalid + span {
color: #ff0000;
}
.file-upload-label:valid + span {
color: #ffffff;
}
#upload #progress-bar {
border: 1px solid #bcbcbc;
width: 50%;
background: #cccccc;
height: 1em;
margin: auto;
border-radius: 0.25em;
}
#upload #progress-bar > span {
display: block;
height: 100%;
width: 0%;
background: #009900;
}
#upload .del-upload {
display: inline-block;
height: 15px;
width: 15px;
margin-right: 1em;
background-image: url('../pics/upload-icon.png');
background-position: 0px 0px;
cursor: pointer;
}
#upload .del-upload:hover {
background-position: 0px -15px;
}
#index #archive ul a:link[href],
#index #archive ul a:visited[href],
#index #archive ol a:link[href],
#archive-download ul a:link[href],
#archive-download ul a:visited[href],
#index #archive ol a:visited[href],
form input[type=submit],
a:link[href].button,
label.file-upload-label,
#upload .button,
#cookie-manager .button,
a:visited[href].button {
white-space: nowrap;
margin: 0.5em 0 1em 0.5em;
line-height: 1.5em;
padding: 0.5em;
font-size: 1.125em;
font-family: 'texgyrebonumbold', 'Arial', sans-serif;
font-variant: small-caps;
color: #fff;
background-color: #2D384A;
border: none;
-webkit-border-radius: .25em;
-moz-border-radius: .25em;
border-radius: .25em;
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
-ms-transition: .2s;
transition: .2s;
}
#archive-download ul {
list-style: none;
}
#archive-download ul li {
float: left;
margin-right: 2em;
}
#archive-download ul a:link[href] {
display: inline-block;
padding: 0.75em;
}
#archive-download ul li .fa {
font-size: 1.5em;
margin-left: 0.25em;
text-shadow:
0 0 1px #000,
0 0 1px #000,
0 0 1px #000;
}
#archive-download ul li span.filesize {
display: block;
font-size: 0.75em;
font-weight: normal;
text-align: center;
}
#archive-download div.col-50 {
clear: both;
}
#index #archive ol a:link[href],
#index #archive ol a:visited[href] {
line-height: 2.5em;
}
#index #archive ul a:link[href],
#index #archive ul a:visited[href],
#login form input[type=submit],
#contact form input[type=submit],
a:link[href].button {
float: right;
}
a:link[href].button.align-center {
float: none;
}
a:link[href].button.float-left {
float: left;
}
#edit_form a:link[href].button,
.col-50 a:link[href].button form input[type=submit],
a:link[href].button.hardcopy {
float: none;
margin: 1em 0;
}
#index #archive ul a:hover[href],
#index #archive ul a:visited:hover[href],
#index #archive ol a:hover[href],
#index #archive ol a:visited:hover[href],
a:hover[href].button,
a:visited:hover[href].button,
form input[type=submit]:hover {
cursor: pointer;
color: #fff;
background-color: #526694;
border-bottom: none;
}
#archive-download ul a:hover[href],
#archive-download ul a:visited:hover[href],
label.file-upload-label:hover,
#cookie-manager .button:hover,
#upload .button:hover {
cursor: pointer;
color: #fff;
background-color: #526694;
}
#login form {
width: 17em;
margin: auto;
}
#login form p {
font-family: 'libre_baskervillebold', Arial, sans-serif;
line-height: 1em;
}
#search form p {
text-align: center;
line-height: 2em;
}
#search #wrapper-inner ul {
list-style: none;
}
#search #wrapper-inner ul li {
margin: 1.5em 0;
padding: 0.5em;
background: #fff;
-webkit-box-shadow: .025em .025em .125em .125em #ccc;
-moz-box-shadow: .025em .025em .125em .125em #ccc;
box-shadow: .025em .025em .125em .125em #ccc;
-moz-border-radius: .125em;
-webkit-border-radius: .125em;
border-radius: .125em;
}
#search #wrapper-inner ul li span {
word-wrap: break-word;
}
#search #wrapper-inner #search_timer {
margin-left: 1em;
}
#search #viewport-wrapper {
text-align: center;
display: none;
}
#search #viewport {
background: #fff;
border: 1px solid #ccc;
}
#search #viewport-heading {
position: absolute;
color: #9c9c9c;
font-size: 1.25em;
padding: 0.25em;
font-family: 'libre_baskervillebold', 'Times New Roman', sans-serif;
}
#edit_form {
text-align: left;
}
#edit_form.text-align-center > p {
text-align: center;
}
#edit_form p a:link {
line-height: 2em;
}
#contact #captcha {
border: 1px solid #7a7a7a;
margin-left: 0.5em;
}
#contact #wrapper-inner form {
margin: 0 auto 4em auto;
}
#contact #wrapper-inner form a:hover {
color: #ff6600;
border: none;
}
#edit_form label {
display: block;
text-align: left;
font-size: 1.125em;
color: #B53801;
white-space: no-wrap;
}
#edit_form input[type=text] {
width: 100%;
margin-bottom: 1em;
}
#edit_form textarea {
min-width: 100%;
min-height: 5em;
margin-bottom: 1em;
}
#edit_form a:hover {
border-bottom: none;
}
#banner {
width: 94%;
max-width: 62.5em;
margin: auto auto 2em auto;
border: 0.75em solid #b8babf;
background-image: none;
background-position: top left;
background-repeat: no-repeat;
}
#banner-image {
float: left;
width: 100%;
height: 13.5em;
background-image: url('../pics/banner-small.jpg');
background-repeat: no-repeat;
background-position: top right;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
border-bottom: 0.75em solid #b8babf;
-webkit-transition: .5s;
-moz-transition: .5s;
-o-transition: .5s;
-ms-transition: .5s;
transition: .5s;
}
#banner-title {
position: absolute;
width: 2em;
height: 13.5em;
font-family: "texgyrebonumbold", Arial, sans-serif;
background-color: #2D384A;
border-right: 1px solid #000;
}
.banner-title-text {
color: #fff;
font-size: 1.5em;
line-height: 1.5em;
-webkit-transform: rotate(-90deg);
-webkit-transform-origin: right bottom 0;
-moz-transform: rotate(-90deg);
-moz-transform-origin: right bottom 0;
-ms-transform: rotate(-90deg);
-ms-transform-origin: right bottom 0;
transform: rotate(-90deg);
transform-origin: right bottom 0;
margin-top: 4.25em;
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
-ms-transition: .2s;
transition: .2s;
}
#banner ul {
float: left;
width: 92%;
list-style: none;
}
#banner li {
display: block;
height: 1.938em;
padding: 0;
font-size: 0.938em;
border-bottom: 0.125em solid #b8babf;
}
#banner ul li:last-child {
border-bottom: none;
}
#banner a:link,
#banner a:visited {
font-family: 'libre_baskervillebold', Arial, sans-serif;
color: #626C7B;
display: block;
width: 100%;
height: 100%;
margin-top: 0.25em;
}
#banner a:hover[href],
#banner a:visited:hover[href] {
color: #ff6600;
border-bottom: none;
}
#contact form label {
font-family: "libre_baskervillebold", Arial, sans-serif;
}
.col-25,
.col-33,
.col-50,
.col-66,
.col-75,
.col-100 {
width: 100%;
}
/* Donate button */
.donate-select {
position: absolute;
padding-top: 4px;
border: none;
background: none;
color: #222D65;
font-weight: bold;
font-size: 18px;
}
/* Poem menu icon sprites */
#poem-nav {
font-size: 0.875em;
position: fixed;
z-index: 100;
top: 60px;
right: 2em;
}
.icon {
height: 55px;
width: 40px;
margin: 5px 0;
text-align: center;
}
#poem-nav .icon strong {
display: block;
}
#poem-nav .icon a:link,
#poem-nav .icon a:visited {
position: absolute;
height: 40px;
width: 40px;
color: #366176;
text-shadow:
-1px -1px 0 #e8e8e8,
1px -1px 0 #e8e8e8,
-1px 1px 0 #e8e8e8,
1px 1px 0 #e8e8e8;
-webkit-transition: .2s;
-moz-transition: .2s;
-o-transition: .2s;
-ms-transition: .2s;
transition: .2s;
}
#poem-nav.dark .icon a:link,
#poem-nav.dark .icon a:visited {
color: #5092C6;
text-shadow:
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000;
}
#poem-nav .icon a:hover,
#poem-nav.dark .icon a:hover {
color: #fff;
text-shadow:
0 0 0.2em #5092C6,
0 0 0.2em #5092C6,
0 0 0.2em #5092C6;
}
.buy-box {
font-size: 0.875em;
margin: 0.5em;
padding: 1em;
background: #ffffff;
float: left;
border: 1px solid #ccc;
-moz-border-radius: .25em;
-webkit-border-radius: .25em;
border-radius: .25em;
}
.buy-box strong {
display: inline-block;
padding-bottom: 0.25em;
}
.book-cover {
max-width: 90%;
border: 1px solid #888;
-webkit-box-shadow: 0px 0px 1em 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow: 0px 0px 1em 0px rgba(50, 50, 50, 0.75);
box-shadow: 0px 0px 1em 0px rgba(50, 50, 50, 0.75);
}
/* Book Cover Code for Download Pages */
/* Fallback styles */
#book {
display: inline-block;
-moz-box-shadow: 5px 5px 20px #aaa;
-webkit-box-shadow: 5px 5px 20px #aaa;
box-shadow: 5px 5px 20px #aaa;
margin: 10px;
}
/* 3d styles */
#book img {
vertical-align: middle;
position: relative;
width: 175px;
height: 225px;
max-width: 100%;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 3px solid #D45602;
}
#book p {
position: relative;
bottom: 0;
text-align: center;
line-height: 1em;
font-size: .75em;
color: #fff;
padding-bottom: 10px;
margin: 10px 10px;
}
.books {
padding: 1em;
-moz-perspective: 100px;
-moz-transform-style: preserve-3d;
}
#book {
position: relative;
-moz-perspective: 100px;
-moz-transform: rotateY(-3deg);
-webkit-transform: perspective(100) rotateY(-3deg);
box-shadow: none;
margin: 0;
}
#book:before,
#book:after {
position: absolute;
top: 2%;
height: 96%;
content: ' ';
z-index: -1;
}
#book:before {
width: 107.5%;
background-color: #000;
box-shadow: 5px 5px 20px #aaa;
}
#book:after {
width: 5%;
left: 100%;
border: 1px solid #ccc;
background-color: #efefef;
box-shadow: inset 0px 0px 5px #aaa;
-moz-transform: rotateY(20deg);
-webkit-transform: perspective(100) rotateY(20deg);
}
#fb-heading {
clear: both;
}
#fb-heading a:link,
#fb-heading a:visited,
#fb-heading a:hover {
color: #B53801;
border-bottom: none;
}
#fb-posts {
font-size: 0.875em;
}
#fb-posts {
display: none;
}
.fb-image img {
margin: 0 0 0 1em;
float: right;
}
.fb_post_date {
font-weight: bold;
color: #ff6600;
text-shadow: 0 0 2px #ccc;
}
.social-like-holder {
width: 100%;
margin: auto;
}
#footer {
font-family: "libre_baskervillebold", Arial, sans-serif;
font-size: .75em;
text-align: center;
width: 100%;
-webkit-box-shadow: 0px -0.5em 0.5em -0.375em #979797;
-moz-box-shadow: 0px -0.5em 0.5em -0.375em #979797;
-o-box-shadow: 0px -0.5em 0.5em -0.375em #979797;
box-shadow: 0px -0.5em 0.5em -0.375em #979797;
}
#footer p {
padding-right: 1.75em;
padding-left: 1.75em;
}
.social-like-left,
.social-like-center,
.social-like-right {
float: none;
margin: auto;
text-align: center;
}
.social-like-left {
width: 100%;
}
.social-like-center {
padding: 0.5em 0 0.5em 0;
width: 100%;
}
.social-like-right {
width: 92%;
margin-left: 6%;
}
.sharer-container-8-icons,
.sharer-container-3-icons {
margin: auto;
width: 100%;
max-width: 168px;
padding: 0.5em 0;
}
.sharer-container-8-icons a:hover[href],
.sharer-container-3-icons a:hover[href] {
border-bottom: none;
}
.sharer-container-8-icons:before,
.sharer-container-3-icons:before {
float: left;
font-family: "libre_baskervillebold", Arial, sans-serif;
font-size: 12px;
margin-top: 15px;
color: #276675;
text-shadow: 0 0 4px #ccc;
}
#wrapper-inner .sharer-container-8-icons:before,
#wrapper-inner .sharer-container-3-icons:before {
margin-top: 5px;
}
.sharer-container-8-icons:before {
content: "SHARE BY";
margin-left: -75px;
}
.sharer-container-3-icons:before {
content: "FOLLOW US";
margin-left: -70px;
}
.sharer-icon,
.follow-icon {
background-image: url('../pics/share.png');
float: left;
cursor: pointer;
}
.sharer-icon {
margin: 6px;
height: 30px;
width: 30px;
}
.follow-icon {
margin: 1px;
height: 40px;
width: 40px;
}
.sharer-icon.sharer-icon-facebook {
background-position: 0 0;
}
.sharer-icon.sharer-icon-facebook:hover {
background-position: 0 -30px;
}
.sharer-icon.sharer-icon-twitter {
background-position: -30px 0;
}
.sharer-icon.sharer-icon-twitter:hover {
background-position: -30px -30px;
}
.sharer-icon.sharer-icon-linkedin {
background-position: -60px 0;
}
.sharer-icon.sharer-icon-linkedin:hover {
background-position: -60px -30px;
}
.sharer-icon.sharer-icon-tumblr {
background-position: -90px 0;
}
.sharer-icon.sharer-icon-tumblr:hover {
background-position: -90px -30px;
}
.sharer-icon.sharer-icon-googleplus {
background-position: -120px 0;
}
.sharer-icon.sharer-icon-googleplus:hover {
background-position: -120px -30px;
}
.sharer-icon.sharer-icon-reddit {
background-position: -150px 0;
}
.sharer-icon.sharer-icon-reddit:hover {
background-position: -150px -30px;
}
.sharer-icon.sharer-icon-pinterest {
background-position: -180px 0;
}
.sharer-icon.sharer-icon-pinterest:hover {
background-position: -180px -30px;
}
.sharer-icon.sharer-icon-stumbleupon {
background-position: -210px 0;
}
.sharer-icon.sharer-icon-stumbleupon:hover {
background-position: -210px -30px;
}
.sharer-icon.sharer-icon-whatsapp {
background-position: -240px 0;
}
.sharer-icon.sharer-icon-whatsapp:hover {
background-position: -240px -30px;
}
.follow-icon.follow-icon-facebook {
margin-left: 15px;
background-position: 0px -60px;
}
.follow-icon.follow-icon-facebook:hover {
background-position: -120px -60px;
}
.follow-icon.follow-icon-twitter {
background-position: -40px -60px;
}
.follow-icon.follow-icon-twitter:hover {
background-position: -160px -60px;
}
.follow-icon.follow-icon-pinterest {
background-position: -80px -60px;
}
.follow-icon.follow-icon-pinterest:hover {
background-position: -200px -60px;
}
html.js .cookie-accept-link,
html.js .cookie-manage-link {
cursor: pointer;
text-decoration: none;
}
html.js .cookie-accept-link,
html.js .cookie-manage-link,
#cookie-gdpr a:link,
#cookie-gdpr a:visited,
.attributions a:link,
.attributions a:visited {
font-family: "libre_baskervillebold", Arial, sans-serif;
color: #d45602;
}
html.js .cookie-accept-link:hover,
html.js .cookie-manage-link:hover,
#cookie-gdpr a:hover,
#cookie-gdpr a:visited:hover,
.attributions a:hover,
.attributions a:visited:hover {
border-bottom: 0.125em solid #d45602;
}
.attributions-left,
.attributions-right {
text-align: center;
}
#footer {
margin-bottom: 1.5em;
}
/* #Styles for view-ports wider than 768px
============================================================== */
@media only screen and (min-width: 48.01em) {
h1 {
font-size: 2.5em;
}
hr {
width: 30%;
}
#logo-text {
display: block;
}
#togglemenu {
position: absolute;
background-color: transparent;
border-bottom: none;
right: 0;
top: 0;
z-index: 0;
}
#togglemenu li {
font-size: 1.063em;
display: inline-block;
text-align: center;
}
#togglemenu li:last-child {
margin-right: 0.375em;
}
#togglemenu li.current a,
#togglemenu li.current a:visited {
color: #fff;
background-color: rgba(115, 126, 144, .6);
}
html.no-js #toggle,
html.js #toggle {
display: none;
}
html.no-js #togglemenu {
top: 0;
border-top: none;
}
html.no-js #logo, html.no-js #logo-text {
display: block;
}
#poem-nav {
display: block;
}
html.no-js #togglemenu,
html.js #togglemenu {
display: inline-block;
text-align: right;
}
#banner-admin {
height: 30em;
background-position: 50% 50%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#banner-admin.background-about {
background-image: url('../pics/background-about-large.jpg');
}
#wrapper-inner ol {
margin-left: 2em;
}
.default-style p,
#wrapper-inner ol {
text-align: justify;
}
.default-style p.text-align-center {
text-align: center;
}
#banner {
background-image: url('../pics/banner-hourglass.gif');
}
#banner-image {
width: 69%;
height: 28.5em;
background-image: url('../pics/banner.jpg');
background-position: center center;
-webkit-background-size: auto 100%;
-moz-background-size: auto 100%;
-o-background-size: auto 100%;
background-size: auto 100%;
border-right: 0.75em solid #b8babf;
border-bottom: none;
}
#banner-title {
height: 28.5em;
}
.banner-title-text {
margin-top: 9.25em;
}
#banner ul {
float: left;
width: 25%;
}
#banner li {
height: 1.875em;
}
ul.content-list {
list-style: none;
margin: 0.5em 0 2.5em 2.5em;
}
#wrapper-outer.poem p {
text-indent: 3em;
margin: 0.5em;
}
#wrapper-outer.poem p.text-align-center {
text-indent: 0;
}
#wrapper-outer.poem li.indent,
#wrapper-outer.poem p.indent {
text-indent: 3.5em;
}
#wrapper-outer.poem li.poem-indent,
#wrapper-outer.poem p.poem-indent,
#wrapper-outer.poem p.indent-1 {
text-indent: 7em;
}
#wrapper-outer.poem p.indent-2 {
text-indent: 10.5em;
}
#wrapper-outer.poem p.indent-3 {
text-indent: 14em;
}
#wrapper-outer.poem p.indent-4 {
text-indent: 17.5em;
}
#wrapper-outer.poem h2.indent,
#wrapper-outer.poem h3.indent,
#wrapper-outer.poem h4.indent {
text-indent: 2.5em;
}
#wrapper-outer.poem span.spacer {
width: 1.75em;
}
#wrapper-outer.poem span.spacer-1 {
width: 3.5em;
}
#wrapper-outer.poem span.spacer-2 {
width: 7em;
}
#wrapper-outer.poem span.spacer-3 {
width: 10.5em;
}
#wrapper-outer.poem span.spacer-4 {
width: 14em;
}
#wrapper-outer.poem span.line-number {
margin-right: 2em;
}
#wrapper-outer.poem span.line-number:before {
content: none;
}
#wrapper-outer.poem span.line-number:after {
content: none;
}
#wrapper-inner {
padding: 0.063em 3em 2em 2.5em;
}
#contact #wrapper-inner form,
#contact form textarea {
width: 35em;
max-width: 95%;
}
#contact form input[type=text] {
width: 15em;
}
#contact form a:link {
margin-right: 15em;
}
html.js #search #viewport-wrapper {
display: block;
}
.wallpaper {
background-image: url('../pics/wallpaper.jpg');
background-position: right top;
background-repeat: no-repeat;
}
ul.site-links {
margin: 0 auto;
}
ul.site-links li {
display: inline-block;
padding: 0 2em;
margin: 0.5em auto;
border-left: medium double #ddd;
width: 18%;
}
ul.site-links li:first-child {
border-left: none;
}
#archive ol {
padding-top: 1em;
padding-bottom: 1em;
}
#archive ol li {
width: 34%;
margin: 1em 6%;
float: left;
}
#archive ol li:nth-child(odd) {
clear: both;
}
#archive ul li {
padding: 0 2%;
width: 43%;
margin: 1em 1.25%;
display: inline-block;
vertical-align: middle;
}
html.js #archive ul li:nth-child(even) {
float: right;
}
html.js #archive ul li:nth-child(odd) {
float: left;
}
#edit_form input[type=text] {
width: 50%;
}
#edit_form textarea {
min-width: 50%;
}
#footer p {
padding-right: 2em;
padding-left: 2em;
}
.col-25, .col-33, .col-50, .col-66, .col-75, ul.site-links-index {
float: left;
padding-left: 2%;
}
.col-25 {
width: 22%;
}
.col-33 {
width: 31%;
}
.col-50, ul.site-links-index, #cookie-manager {
width: 44%;
}
#archive-download div.col-50 {
clear: none;
}
.col-66 {
width: 60%;
}
.col-75 {
width: 69%;
}
.audio-player-responsive-wrapper {
width: 33%;
}
.audioplayer-bar {
display: inherit;
}
.social-like-holder {
width: 52.5%;
}
.social-like-left,
.social-like-center,
.social-like-right {
width: 100%;
margin: auto;
}
.social-like-left {
float: right;
}
.social-like-right iframe {
padding-top: 10px;
}
.sharer-container-8-icons {
max-width: 336px;
}
.menu-respond {
display: block
}
.menu-respond-mobile {
display: block;
}
.mobile-show {
display: none;
}
.attributions-left {
text-align: right;
width: 49%;
float: left;
}
.attributions-right {
text-align: left;
width: 49%;
float: right;
}
.text-align-justify {
text-align: justify;
}
}
/* #Styles for view-ports wider than 560px but less than 768px
============================================================== */
@media only screen and (min-width: 35em) and (max-width: 48em) {
h1 {
font-size: 2.5em;
}
hr {
width: 50%;
}
#wrapper-inner ol {
text-align: justify;
}
#logo-text {
display: block;
}
#nav {
width: 60%;
}
#poem-nav {
display: block;
}
html.no-js #logo, html.no-js #logo-text {
display: none;
}
#banner-admin {
height: 22em;
background-position: 50% 50%;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#banner-admin.background-about {
background-image: url('../pics/background-about-large.jpg');
}
#banner {
background-image: url('../pics/banner-hourglass.gif');
}
#banner-image {
width: 60%;
height: 28.5em;
background-image: url('../pics/banner.jpg');
background-position: center center;
-webkit-background-size: auto 100%;
-moz-background-size: auto 100%;
-o-background-size: auto 100%;
background-size: auto 100%;
border-right: 0.75em solid #b8babf;
border-bottom: none;
}
#banner-title {
height: 28.5em;
}
.banner-title-text {
margin-top: 9.25em;
}
#banner ul {
float: left;
width: 33%;
}
#banner li {
height: 1.875em;
}
.wallpaper {
background-image: url('../pics/wallpaper-medium.jpg');
background-position: right top;
background-repeat: no-repeat;
}
ul.content-list {
list-style: none;
margin: 0.5em 0 2.5em 2.5em;
}
#wrapper-outer.poem p {
text-indent: 1.5em;
margin: 0.5em;
}
#wrapper-outer.poem p.text-align-center {
text-indent: 0;
}
#wrapper-outer.poem li.indent,
#wrapper-outer.poem p.indent {
text-indent: 2em;
}
#wrapper-outer.poem li.poem-indent,
#wrapper-outer.poem p.poem-indent,
#wrapper-outer.poem p.indent-1 {
text-indent: 4em;
}
#wrapper-outer.poem p.indent-2 {
text-indent: 6em;
}
#wrapper-outer.poem p.indent-3 {
text-indent: 8em;
}
#wrapper-outer.poem p.indent-4 {
text-indent: 10em;
}
#wrapper-outer.poem h2.indent,
#wrapper-outer.poem h3.indent,
#wrapper-outer.poem h4.indent {
text-indent: 1.5em;
}
#wrapper-outer.poem span.line-number {
margin-right: 2em;
}
#wrapper-outer.poem span.line-number:before {
content: none;
}
#wrapper-outer.poem span.line-number:after {
content: none;
}
#wrapper-inner {
padding-left: 2.5em;
}
#contact #wrapper-inner form,
#contact form textarea {
width: 25em;
max-width: 95%;
}
#contact form input[type=text] {
width: 15em;
}
#contact form a:link {
margin-right: 5em;
}
html.js #search #viewport-wrapper {
display: block;
}
#edit_form input[type=text] {
width: 70%;
}
#edit_form textarea {
min-width: 70%;
}
#footer p {
padding-right: 2em;
padding-left: 2em;
}
.col-25, .col-33, .col-50, .col-66, .col-75 {
float: left;
padding-left: 2%;
}
.col-25 {
width: 31%;
}
.col-33 {
width: 31%;
}
.col-50, #cookie-manager {
width: 44%;
}
#archive-download div.col-50 {
width: 100%;
float: none;
clear: both;
padding: none;
}
.col-66, .col-75 {
width: 60%;
}
.audio-player-responsive-wrapper {
width: 50%;
}
.audioplayer-bar {
display: inherit;
}
.fb-image img {
float: none;
margin: 0.5em;
}
.social-like-holder {
width: 70%;
}
.social-like-center {
margin-left: 10%;
}
.sharer-container-8-icons {
max-width: 336px;
}
.social-like-right iframe {
padding-top: 10px;
}
.menu-respond {
display: none;
}
.menu-respond-mobile {
display: block;
}
.mobile-show {
display: none;
}
.attributions-left {
text-align: center;
width: 49%;
}
.attributions-left {
float: left;
}
.text-align-justify {
text-align: justify;
}
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important;
/* Black prints faster: h5bp.com/s */
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group;
/* h5bp.com/t */
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
#nav {
display: none;
visibility: hidden;
}
}