body {background-color: #F5F5F5; color: black; padding: 0; margin: 0;}

/*
 * Font properties in page_title, page_content and page_footer are intended
 * to define width of these elements in ch units. Child elements may set
 * different font properties for display purposes, as needed.
*/
.page_title {font: 11pt Verdana, sans-serif; max-width: 127ch; width: 86%; height: 110px; margin: 0.5em auto 0.5em; padding: 0; background-color: #DDD; border: 1px solid #AAA;}
.page_title div.blog_title {font-size: 18pt; font-weight: bold; margin: 5px 20px;}
.page_title div.blog_tagline {font-size: 12pt; font-weight: bold; margin-left: 20px;}
.page_title a {text-decoration: none; color: black;}

.page_content {font: 11pt Verdana, sans-serif; max-width: 127ch; border-collapse: collapse; width: 86%; margin: 0.5em auto; padding: 0; background-color: white; color: black; border: 1px solid #AAA;}
.page_content .nav_th {vertical-align: top; padding: 1.5em 15px 1.5em 0; text-align: left;}
.page_content .content_td {vertical-align: top; padding: 0 30px 0 20px;}

.page_footer {font: 11pt Verdana, sans-serif; max-width: 127ch; width: 86%; margin: 2px auto 0;}

.google-ads {max-width: 127ch; width: 86%; margin: 0 auto; padding: 0;}

/* posts */
.post_header {margin: 1.5em 0 0; padding: 0;}

.post_title {margin-bottom: 0.25em; font: bold 14pt Arial, sans-serif;}
.post_text {font-size: 11pt; line-height: 1.3em;}

.post_info {font-size: 10pt; color: #777; margin-bottom: 1em;}
.post_info span.draft {color: red;}
.post_info span.post-date {color: #333;}
.post_info span.post-category a, div.post_info span.post-name a {text-decoration: none}
.post_info span.post-category a:hover, div.post_info span.post-name a:hover {text-decoration: underline}

.post_footer {font-size: 10pt; padding: 0.75em 0; margin: 1em 0; border-bottom: 1px solid #aaa;}

.post_index {margin: 1em auto; padding: 2px 5px; border: 1px solid #CCC; background-color: #F5F5F5;}
.post_index a {text-decoration: none;}
.post_index div.post_title {font-size: 12pt;}
.post_index div.post_info {font-size: 9pt;}

/* blog menus */
.menu {font: 11pt Verdana, sans-serif;}

.menu a {margin: 0; text-decoration: none;}
.menu a:hover {text-decoration: underline;}

.sub_menu {border: 1px solid #AAA; background-color: #FAFAFA;}
.sub_menu div {margin: 5px 3px; padding: 1px 5px;}

.main_menu {margin: 0 auto;}

.archive_menu {margin: 15px auto;}
.archive_menu .archive-year {overflow: hidden}
.archive_menu .archive-year .archive-year-post-count {color: #999}
.archive_menu .archive-year-entry {margin: 0; padding: 0; cursor: pointer}
.archive_menu .archive-year-collapsed {height: 1.1em}
.archive_menu .archive-year-collapsed .archive-year-post-count:hover::after {content: " \203a"}
.archive_menu .archive-year-months {margin: 0.5em 0 0 0; padding: 0; font-size: 0.95em;}
.archive_menu .archive-year-month-entry {margin: 0.25em 0 0 0; padding: 0}

.cat_menu {margin: 15px auto;}

.new_comments_menu {margin: 15px auto; border: 1px solid #777; font-size: 9pt; font-weight: normal;}
.new_comments_menu div {margin: 5px 2px; padding: 0;}

/* links */
a.link-button {text-decoration: none; color: black; background-color: #f0f0f0; border: 1px solid #667ca0; padding: 0.1em 0.5em; margin: 0.5em 0.5em 0.5em 0; border-radius: 4px;}

/* images */
img.rss_inline {float: right; margin: 1px 5px; border-style: none;}

/* messages and warnings */
.warning_box {border: 1px solid red; padding: 2px 5px; margin: 1.5em 25%; color: red; background-color: #FFC; text-align: center;}
.message_box {border: 1px solid #39C; text-align: center; padding: 2px 5px; margin: 1.5em 20%; background-color: #E0EEFF;}

/* forms */
form {margin: 0; padding: 0; border-style: none;}
