body {
background-color: #f0f0f0;
font-family: "Times New Roman", Times, serif;
font-size: 113%;
line-height: 115%;
color: #3c3c3c;
}

h1,h2,h3,h4,h5,h6 {
text-align: center;
font-weight: bold;
font-family: sans-serif;
font-size: 200%;
margin-top: 0px;
margin-bottom: 15px;
}

h2 {font-size: 150%; margin-top: 15px; margin-bottom: 15px;}
h3 {font-size: 125%; margin-top: 10px; margin-bottom: 15px;}
h4 {font-size: 95%; margin-top: 10px; margin-bottom: 10px;}

p {
font-size: 100%;
text-align: justify;
text-justify: inter-word;
margin: 10px 172px 10px 172px;
text-indent: 15px;
}

.bold {
font-weight: bold;
}
.wrapper {
margin: auto;
width: 1100px;
border: 1px solid #3c3c3c;
}

.header {
text-align: center;
background-color: #d5dbe1;
border-bottom: 1px solid #3c3c3c;
padding-top: 15px;
padding-bottom: 15px;
}

.headerLeft {
float: left;
margin: 0px 0px 0px 10px;
}

.headerRight {
float: right;
margin: 0px 10px 0px 0px;
}

.content {
text-align: center;
background-color: #fafafa;
padding-top: 10px;
padding-bottom: 25px;
}

.blog {
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
text-align: justify;
width: 700px;
min-height: 300px;
padding: 10px 20px 10px 20px;
border: 1px solid #3c3c3c;
border-radius: 5px;
background-color: #ffffff;
}

.blog_image {
float: left;
border: 1px solid #3c3c3c;
border-radius: 5px;
box-shadow: 1px 2px 4px #3c3c3c;
margin: 20px 20px 10px 5px;
}

.blog_image_pano {
display: block;
margin: auto;
border: 1px solid #3c3c3c;
border-radius: 5px;
box-shadow: 1px 2px 4px #3c3c3c;
}

.blog-video {
display: block;
margin: 0 auto;
border-radius: 5px;
box-shadow: 1px 2px 4px #3c3c3c
}

.blog_google_maps_table {
font-size: 95%;
border-collapse: collapse;
margin-left: 200px;
border: 0px solid #dddddd;
}

.blog_google_maps_td {
border: 0px solid #dddddd;
text-align: left;
padding-right: 7px;
background-color: #fafafa;
}

.blog_google_maps_bold {
font-weight: bold;
}

textarea {
padding: 12px;
box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
background-color: #f8f8f8;
font-size: 16px;
resize: none;
}

mark { 
background-color: #f9da49;
color: #000000;
}

.video-library {
float: left;
border-radius: 5px;
box-shadow: 1px 2px 4px #3c3c3c
}

.video-library-box {
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
text-align: justify;
width: 700px;
height: 200px;
padding: 10px 20px 10px 20px;
border: 1px solid #3c3c3c;
border-radius: 5px;
background-color: #ffffff;
}

.blog-text {
font-size: 100%;
text-align: justify;
text-justify: inter-word;
margin: 10px 0px 0px 0px;
text-indent: 15px;
}

.blog-text-update {
color: #880808;
}

.blog-current-page {
font-size: 150%;
}

.container {
text-align: center;
}

.myUL {
display: inline-block;
text-align: left;
}

.blogUL {
display: inline-block;
text-align: left;
list-style-type: square;
margin: 25px 80px 25px 80px;
}

.myOL {
display: inline-block;
text-align: left;
}

.regular-text {
text-align: left;
}

.bold-text {
text-align: left;
font-weight: bold;
}

.guestbook {
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
text-align: justify;
width: 700px;
padding: 10px 20px 10px 20px;
border: 1px solid #3c3c3c;
border-radius: 5px;
}

.label {
position: relative;
top: 0;
left: 0;
text-align: left;
padding-bottom: 15px;
}

.guestbook-reply {
font-style: italic;
color: #990000;
font-size: 95%;
padding-left: 50px;
padding-right: 50px;
}

.edit {
padding-left: 10px;
color: #e00000;
font-variant: small-caps;
font-size: 100%;
}

.fieldset {
margin: auto;
width: 675px;
padding: 15px;
background-color: #f0f0f0;
border: 1px solid #3c3c3c;
border-radius: 5px;
}

.alert-sold-out {
font-size: 400%;
font-weight: bold;
color: #ff0000;
}

.alert-delay {
font-size: 150%;
font-weight: bold;
color: #ff0000;
}

.thumbnail_box {
font-size: 100%;
float: left;
width: 263px;
height: 336px;
margin: 5px;
background-color: #fafafa;
border-radius: 5px;
border: 1px solid #3c3c3c;
padding-top: 5px;
padding-bottom: 5px;
}

.thumbnail_image {
position: relative;
border: 1px solid #3c3c3c;
border-radius: 5px;
box-shadow: 1px 2px 4px #3c3c3c;
margin-top: 10px;
margin-bottom: 10px;
}

.thumbnail_image:hover {
opacity: 0.50;
transition: 0.5s;
}

.small {
border: 1px solid #3c3c3c;
border-radius: 5px;
box-shadow: 1px 2px 5px #3c3c3c;
margin-bottom: 10px;
}

.fullsize_image {
margin-bottom: 15px;
border-radius: 5px;
border: 1px solid #3c3c3c;
box-shadow: 2px 4px 8px #3c3c3c;
}

.book {
margin-bottom: 15px;
-webkit-filter: drop-shadow(5px 5px 5px #222222);
filter: drop-shadow(5px 5px 5px #222222);
}

iframe {
border: 1px solid #3c3c3c;
border-radius: 5px;
box-shadow: 2px 4px 8px #3c3c3c;
}

ul {
text-align: left;
list-style-type: square;
margin: 25px 200px 25px 200px;
}

.audio-library {
margin-left: auto;
margin-right: auto;
}

.audio {
position: relative;
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
text-align: justify;
width: 800px;
height: 675px;
padding: 10px 20px 10px 20px;
border: 1px solid #3c3c3c;
border-radius: 5px;
background-color: #ffffff;
}

.button {
background-color: #3c3c3c;
color: #ffffff;
border: 1px solid #3c3c3c;
padding: 15px 32px;
margin-top: 0px;
margin-bottom: 15px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
cursor: pointer;
}

.playButton {
font-size: 32px;
margin: 4px 2px;
}

.button:hover, .button:active {
background-color: #ffffff;
color: #3c3c3c;
border: 1px solid #3c3c3c;
box-shadow: 1px 3px 6px #000000;
}

.volumeBox {
position: absolute;
width: 245px;
top: 386px;
left: 273px;
background-color: #eeeeee;
padding: 3px 8px 0px 8px;
border: 1px solid #3c3c3c;
border-radius: 5px;
}

#volumeDisplay {
float: right;
padding: 3px 0px 0px 5px;
}

.download_link {
position: absolute;
top: 380px;
right: 23px;
background-color: #3c3c3c;
color: #ffffff;
border: 1px solid #3c3c3c;
text-decoration: none;
padding: 10px 30px;
}

.download_link:hover, .download_link:active {
background-color: #ffffff;
color: #3c3c3c;
border: 1px solid #3c3c3c;
box-shadow: 1px 3px 6px #000000;
}

#loadingProgress {
margin: auto;
width: 70px;
position: relative;
top: 50px;
z-index: 10;
text-align: center;
font-weight: bold;
font-family: sans-serif;
font-size: 150%;
color: #3c3c3c;
background-color: #f5f5f5;
padding: 5px 10px 5px 10px;
border: 1px solid #3c3c3c;
box-shadow: 1px 2px 4px #3c3c3c;
border-radius: 5px;
}

#waveform {
overflow: hidden;
position: relative;
margin: auto;
width: 800px;
height: 255px;
margin-top: 15px;
margin-bottom: 15px;
padding: 0px 0px 0px 0px;
border: 1px solid #3c3c3c;
box-shadow: 1px 2px 4px #3c3c3c;
border-radius: 5px;
background-color: #f0f0f0;
background-image: url("https://www.leonardwhistler.com/audio/waveform-overlay.png");
}

#audioProgress,#audioDuration,#forwardSlash {
position: absolute;
width: 40px;
bottom: 0px;
left: 50px;
background-color: #000000;
color: #cccccc;
text-align: center;
z-index: 3;
}

#audioDuration {
left: 0px;
color: #ffffff;
}

#forwardSlash {
width: 10px;
left: 40px;
}

.audio_library_image {
float: left;
border: 1px solid #3c3c3c;
border-radius: 5px;
box-shadow: 1px 2px 4px #3c3c3c;
margin: 20px 20px 10px 5px;
}

tr:nth-child(even) {
background-color: #f0f0f0;
}

table, th, td {
border: 1px solid;
}

a.nav:link, a.nav:visited {
padding: 5px 10px;
background-color: #f0f0f0;
color: #3c3c3c;
text-align: center;
text-decoration: none;
display: inline-block;
border: 1px solid #3c3c3c;
margin-top: 10px;
margin-bottom: 5px;
}

a.nav:hover, a.nav:active {
background-color: #fafafa;
border: 1px solid #3c3c3c;
box-shadow: 1px 3px 6px #000000;
}

a.nav_port:link, a.nav_port:visited {
padding: 5px 10px;
background-color: #3c3c3c;
color: #fafafa;
text-align: center;
text-decoration: none;
display: inline-block;
border: 1px solid #3c3c3c;
margin-top: 10px;
margin-bottom: 5px;
}

a.nav_port:hover, a.nav_port:active {
color:  #3c3c3c;
background-color: #fafafa;
border: 1px solid #3c3c3c;
box-shadow: 1px 3px 6px #000000;
}

a.isbn:link, a.isbn:visited, a.isbn:hover, a.isbn:active {
font-family: 'Courier New', monospace;
font-size: 110%;
font-weight: bold;
color: #3c3c3c;
}

a.isbn:hover {
text-decoration: none;
color: #111111;
}

a.disabled:hover, a.disabled:active {
background-color: #f0f0f0;
box-shadow: 0px 0px 0px #f0f0f0;
}

.disabled {
opacity: 0.3;
cursor: not-allowed;
}

a.blogLink:link, a.blogLink:visited {
background-color: #f0f0f0;
color: #3c3c3c;
font-size: 110%;
}
a.blogLink:hover, a.blogLink:active {
background-color: #333333;
color: #cccccc;
font-size: 110%;
}

a.postID:link, a.postID:visited {
background-color: #f0f0f0;
color: #3c3c3c;
font-size: 110%;
}
a.postID:hover, a.postID:active {
background-color: #333333;
color: #cccccc;
font-size: 110%;
}

.footer {
clear: left;
text-align: center;
background-color: #d5dbe1;
color: #3c3c3c;
border-top: 1px solid #3c3c3c;
}