/* 
Theme Name: Shockstone Modern
Theme URI: http://wpthemes.info
Version: 3.0.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: shockstone-modern
Description: Dynamic, responsive Shockstone theme preserving the classic Connections design. Based on Connections by Patricia Muller, customized by Matthew Smith.
Author: Patricia Muller
Author URI: http://www.vanillamist.com/blog/
Modified by: Matthew Smith
*/
body {
	margin:0;
	padding:0;
	font-family: 'Trebuchet MS',Georgia, Times, Times New Roman, sans-serif;
	font-size: 0.9em;
	text-align:center;
	color:#29303B;
	line-height:1.3em;
	background: #F4F4FA;
}
a {
	color: #333C5D;	
	text-decoration:underline;
}
a:visited {
	color: #8a3207;
        text-decoration:underline;
}
a:hover {
	color: #753206;
	text-decoration:underline;
}
input, textarea 
{
	background: #F4F4FA;
	border: #E1D6C6 1px solid;
}
#rap 
{
	background:#fff url('img/rap.jpg') center repeat-y;
	width:760px;
	margin:0 auto;
	padding:0px 8px;
	text-align:left;
	font-family: Trebuchet MS,Georgia, Arial, serif;
	font-size: 0.9em;
}
#header {
	background:#fff url('img/top.jpg') no-repeat bottom; 	
 	height: 189px;
	margin: 0 auto;
	width:760px;
	padding:0;
	border:#fc9 0px solid;
}
#main 
{
	margin:0 auto;
	padding:0;
	background:#000 url('img/content_bg.gif') repeat;
	width:740px;
}
#content {
	width:510px;
	float:left;
	padding:5px;
	margin:0;
	overflow:hidden;
	display:inline;
}#sidebar {
	width:186px;
	float:right;
	padding:0px 8px 10px 8px;
	margin:0;
	font-size:1em;
	color:#333;
	display:inline;
} 
a img {
	border: none;
}
acronym, abbr {
	border-bottom: 1px dotted #0c6bf0;
}
acronym, abbr, span.caps {
	cursor: help;
	letter-spacing: .07em;
}
code {
	font-size: 1em;
	font-style: italic;
}
blockquote {
	margin: 15px 30px 0 45px;
	padding: 0 0 0 45px;
	background: url('img/blockquote.gif') no-repeat left top;
	font-style:italic;
}

cite {
	font-size: 0.9em;
	font-style: normal;
}
h3 {
	margin: 0;
	padding: 0;
	font-size:1.3em;
}
p {
	margin: 0 0 1em;
	padding: 0;
	line-height: 1.5em;
}
h1, h2, h3, h4 {
	font-family: Georgia, "Lucida Sans Unicode", lucida, Verdana, sans-serif;
	font-weight: normal;
	letter-spacing: 1px;
}
#header h1 
{
	margin: 0;	
	font-size: 1.6em;	
	padding:10px 20px 0 0;
	text-align:right;	
}
#header h1 a 
{
	color:#B8BAE6;
	text-decoration:none;
}
#header h1 a:hover 
{
	color:#F7F3ED;
}
#header #desc
{
	font-weight:normal;
	font-style:italic;
	font-size:1em;
	color:#B8BAE6;
	text-align:right;
	margin:0;
	padding:0 20px 0 0;
}
#sidebar h2 {
	margin: 10px 0 0 0;
	padding:2px;
	font-size: 1em;
	color: #333C5D;
	text-align:center;
	background:url('img/sidenav_top.jpg') no-repeat center;
	border:#ccc 0px solid;
	height:22px;
	font-weight:bold;
}
#sidebar ul {
	list-style-type: none;
	padding: 5px;
	margin: 0;
	font-size: 0.9em;	
	padding-bottom:3em;
	background:#F4F4FA url('img/sidenav_bottom.jpg') no-repeat bottom;
	border:#E1D6c6 1px solid;
	border-top:#f3f6ed 1px solid;
}
#sidebar ul li {
	margin: 0.1em 0 0 0;
	padding: 0;	
}
#sidebar li a {
	text-decoration: none;
	border:none;
}
#sidebar li a:link {
	color: #333C5D;	
}
#sidebar li a:visited {
	color: #999999;	
}
#sidebar li a:hover, #sidebar li a:active {
	color: #990000;
}
#content ul {
	margin-left: 0;
	padding-left: 45px;
	list-style-type: none;
}
#content ul li {
	background: url('img/bullet.gif') no-repeat 0 7px;
	padding-left: 1.5em;
}
.post 
{
	margin:0 0 30px 0;
}
.post-info 
{
	font-size:0.85em;
	font-family: Verdana, Arial, Sans-Serif;
	margin:0;
	padding:0;
	color:#333;
}
.post-info a
{
	color:#990000;
}
.post-info a:hover 
{
	color:#000;
}
.post-content {
	padding:10px 0;
	margin:3px 0;
	border-top:#BBC4A3 1px solid;	
	font-family: Georgia, Verdana, Arial, serif;
	font-size:12px;
}
.post-title {
	font-family:Georgia, Arial, Serif;
	font-size:1.3em;
	margin:0;
	font-weight:bold;
}
.post-title a:link, .post-title a:visited, .post-title a:hover, .post-title a:active
{
	text-decoration:none;
	color:#333C5D;
}
.post-date {
	float: left;
	color: #333C5D;
	font-family: Georgia,'Lucida sans ms', Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	text-align: center;
	font-weight: bold;
	margin: 3px 10px 0 0;
	padding: 8px 3px;
	width: 55px;
	background: #DADBE4;
	line-height:1em;
}
.post-footer 
{
	padding-top:20px;
	background:url('img/divider.gif') no-repeat center;
}
#footer {
	margin:0 auto;
	padding: 7px 0;
	border-top:#BBC4A3 1px solid;
	clear: both;
	font-size: 0.8em;
	color: #999;
	text-align:center;
	width:740px;
}
#footer a {
border:none;
color:#7A7636;
}

.commentlist {
	font-size:1em;
	font-weight:normal;	
}
#commentform 
{
	margin:0 0 0 40px;
}
#commentform textarea {
	width: 80%;
}
#commentform p {
	margin: 0 0 1em;
}
#comments,#respond {
	text-transform: uppercase;
	margin: 3em 0 1em 40px;
	color: #333C5D;
	font: 0.9em verdana, helvetica, sans-serif;
}
.commentlist li 
{
	margin:5px 0;
	padding:10px 10px 20px 10px;
	background:#F4F4FA url('img/comments_bottom.jpg') repeat-x bottom;
	border:#E1D6C6 1px solid;
}
.commentlist .alt 
{

}
#topnav 
{
	list-style:none;
	font-size:0.9em;
	margin:0 auto;	
	padding:18px 20px 0 0;
	text-align:right;	
	font-family:Verdana, Arial, Sans-Serif;
}
#topnav li 
{
	list-style:none;
	display:inline;
	padding:0;
	margin:0;
	font-weight:bold;
}

#topnav li a:link, #topnav li a:visited
{
	text-decoration:none;	
	color:#B8BAE6;
}
#topnav li a:hover, #topnav li a:active
{
	color:#F7F3ED;	
}

		#content ul.cosmos {
			margin: 2em 0;
			list-style: none;
			font-size: 140%;
			}

		#content li.cosmos {
			display: inline;
			padding: 0;
			margin: 4px;
			line-height: 2em;
			}

		#content li.keyword1 { font-size: 0.7em; }
		#content li.keyword2 { font-size: 0.9em; }
		#content li.keyword3 { font-size: 1.0em; }
		#content li.keyword4 { font-size: 1.1em; }
		#content li.keyword5 { font-size: 1.2em; }
		#content li.keyword6 { font-size: 1.3em; }
		#content li.keyword7 { font-size: 1.4em; }
		#content li.keyword8 { font-size: 1.5em; }
		#content li.keyword9 { font-size: 1.6em; }
		#content li.keyword10 { font-size: 1.7em; }
		#content li.keyword11 { font-size: 1.8em; }
		#content li.keyword12 { font-size: 1.9em; }
		#content li.keyword13 { font-size: 2.0em; }
		#content li.keyword14 { font-size: 2.1em; }
		#content li.keyword15 { font-size: 2.2em; }


/* 2.0.1: Restore classic sidebar chrome for modern WordPress widgets.
   The original theme expected most sidebar content inside <ul>; modern
   widgets often render blockquotes, selects, divs, etc. This applies the
   original sidenav_top / sidenav_bottom artwork to the widget container
   itself so all widget types retain the classic Connections look. */
#sidebar .widget {
	box-sizing: border-box;
	width: 186px;
	margin: 0 0 10px 0;
	padding: 0 5px 19px 5px;
	background: #F4F4FA url('img/sidenav_bottom.jpg') no-repeat left bottom;
	border: #E1D6C6 1px solid;
	border-top: 0;
}
#sidebar .widget > h2,
#sidebar .widget > .widget-title {
	box-sizing: border-box;
	width: 186px;
	height: 26px;
	margin: 10px -6px 5px -6px;
	padding: 3px 4px 0 4px;
	background: url('img/sidenav_top.jpg') no-repeat left top;
	border: 0;
	color: #333C5D;
	font-size: 1em;
	font-weight: bold;
	line-height: 22px;
	text-align: center;
}
#sidebar .widget > ul {
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
}
#sidebar .widget select,
#sidebar .widget input,
#sidebar .widget textarea {
	max-width: 100%;
	box-sizing: border-box;
}

/* Restoration: preserve the desktop design while accommodating small screens. */
#main { display: flow-root; }
.post-content { display: flow-root; overflow-wrap: anywhere; }
.post-content img, .post-content video, .post-content iframe { max-width:100%; }
.post-content img { height:auto; }
.post-content pre { overflow:auto; }
#sidebar .widget { margin-bottom: 1em; }
#sidebar .widget ul { padding-bottom: 1em; }
#sidebar input[type="search"] { box-sizing:border-box; max-width:100%; }
.screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); }
.skip-link:focus { position:fixed; top:8px; left:8px; width:auto; height:auto; clip:auto; z-index:100000; padding:8px; background:white; }
.navigation { clear:both; margin: 20px 0; }
#content .commentlist { padding-left:0; }
#content .commentlist li { background:#F4F4FA; }
#content .commentlist .children { padding-left:15px; }
@media (max-width: 790px) {
 #rap { box-sizing:border-box; width:100%; padding:0 8px; background:white; }
 #header { width:100%; background-size:100% auto; height:auto; min-height:110px; aspect-ratio:760 / 189; }
 #topnav { padding:12px 10px 0; font-size:11px; }
 #main, #footer { width:100%; }
 #main { background:white; }
 #content { box-sizing:border-box; width:70%; }
 #sidebar { box-sizing:border-box; width:30%; padding:0 5px 10px; }
}
@media (max-width: 560px) {
 #content, #sidebar { float:none; width:100%; display:block; }
 #sidebar h2 { background-color:#DADBE4; background-size:100% 100%; }
 #commentform { margin-left:0; }
 #header { min-height:100px; }
}

/* 3.0: Editable identity and header; classic desktop geometry is retained. */
#header { position:relative; background:#fff; height:189px; box-sizing:border-box; padding:7px 13px 8px; }
.header-bar { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:30px; padding:0 16px; background:#333c5d; border:1px solid #f4f4fa; }
#header .site-title { margin:0; padding:0; font:24px/1.2 Verdana,Arial,sans-serif; letter-spacing:1px; text-transform:lowercase; }
#header .site-title a { color:#f4f4fa; text-decoration:none; }
.site-branding { flex-shrink:0; }
.custom-logo-link { display:block; }
.custom-logo { display:block; height:28px; width:auto; max-width:170px; }
#topnav { padding:0; margin:0; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:0; font-size:11px; }
#topnav > li { position:relative; display:block; }
#topnav > li + li::before { content:'|'; color:#b8bae6; margin:0 4px; }
#topnav a { display:inline-block; padding:4px 0; }
#topnav ul { display:none; position:absolute; top:100%; right:0; min-width:145px; padding:6px 10px; margin:0; text-align:left; list-style:none; background:#333c5d; z-index:5; }
#topnav li:hover > ul, #topnav li:focus-within > ul { display:block; }
#topnav ul li { display:block; position:relative; }
#topnav ul ul { top:0; right:100%; }
.forest-banner { position:relative; height:144px; overflow:hidden; border:1px solid #dadbe4; }
.forest-banner img { display:block; width:100%; height:100%; object-fit:cover; }
.forest-banner .classic-banner { position:absolute; width:787px; max-width:none; height:191px; left:50%; bottom:0; transform:translateX(-50%); }
.site-description { padding:6px 18px; margin:0; background:#f4f4fa; }
#content { overflow:visible; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline:2px solid #753206; outline-offset:3px; }
#topnav a:focus-visible { outline-color:#fff; }
.screen-reader-text { border:0; clip-path:inset(50%); margin:-1px; padding:0; white-space:nowrap; }
.skip-link:focus { clip-path:none; margin:0; }
#content h1.post-title { font-size:1.3em; }
.post-content figure { max-width:100%; margin-left:0; margin-right:0; }
.post-content .wp-caption { max-width:100%; }
.post-content table { display:block; max-width:100%; overflow-x:auto; }
.post-content audio, .post-content embed, .post-content object { max-width:100%; }
.post-content .wp-block-embed iframe { width:100%; }
.wp-block-image img { height:auto; }
.alignleft { float:left; margin:0 12px 8px 0; }
.alignright { float:right; margin:0 0 8px 12px; }
.aligncenter { display:block; margin-left:auto; margin-right:auto; }
.wp-caption-text, .gallery-caption { font-size:.9em; }
#sidebar .widget > h2, #sidebar .widget > .widget-title { height:auto; min-height:26px; overflow-wrap:anywhere; }
#sidebar .widget ul ul { padding:0 0 0 12px; background:none; border:0; }
#sidebar blockquote { margin:12px 15px; padding:0; background:none; }
#sidebar .widget { overflow-wrap:anywhere; }
#commentform input:not([type=checkbox]):not([type=submit]), #commentform textarea { box-sizing:border-box; max-width:100%; }
.bypostauthor > .comment-body { border-left:2px solid #333c5d; padding-left:8px; }
.sticky .post-title { text-decoration:underline; }
@media(max-width:790px) {
 #header { width:100%; height:auto; min-height:0; aspect-ratio:auto; padding:6px 0; }
 .header-bar { gap:8px; padding:4px 10px; flex-wrap:wrap; }
 .forest-banner { height:144px; }
 #sidebar .widget { width:100%; }
 #sidebar .widget > h2, #sidebar .widget > .widget-title { width:calc(100% + 12px); background:#dadbe4; }
 #sidebar .widget { background-color:#f4f4fa; background-position:center bottom; }
}
@media(max-width:560px) {
 #header .site-title { font-size:24px; }
 .header-bar { display:block; }
 #topnav { justify-content:flex-start; text-align:left; margin-top:5px; font-size:12px; }
 #topnav a { padding:5px 0; }
 #topnav ul { right:auto; left:0; }
 #topnav ul ul { right:auto; left:100%; }
 #content { padding:8px; }
 #sidebar { padding:0 8px 10px; }
 .forest-banner { height:110px; }
 .post-content { font-size:14px; }
 #comments, #respond { margin-left:0; }
}

/* Keep navigation layering inside the header so gallery overlays cover it. */
#header { isolation:isolate; }