/*Welcome to Custom CSS!To learn how this works, see http://wp.me/PEmnE-Bt */

/*Adjusts max width of facbook video embeds because they were too large and off screen centered the video within the content area. If you want it to stay left-aligned, remove the two margin and display declarations.*/.fb_iframe_widget_fluid_desktop {  max-width: 460px !important;  margin-left: auto;  margin-right: auto;  display: block !important;}

/*right align images in [display-posts]*/.attachment-thumbnail.size-thumbnail.wp-post-image {    float: right;    margin: 0 0 5px 5px;}

/*adds the words "previous" and "next" before the previous and next post titles on the main posts page and changes the text color to red*/.nav-next:before {	content: "next post ";	color: darkred;}.nav-previous:before {	content: "previous post";	color: darkred;}

/*hides page elements for coverpage that is embeded in jsm.com*/.page-id-17508 #masthead, .page-id-17508 #sidebar-footer {	display: none;}.page-id-17508 .entry-breadcrumbs {	display: none;}

/* Orignially, the following two code snips reduced sidebar and increased content area for for posts and pages if less than 100 percent it leaves a gap between - change to comment out the sidebar when I decided not to use a sidebar widget for post pages.#secondary {	width: 20%;	padding: 0;	margin: 0;}*/#primary {	width: 100%;	padding: 0;	margin: 0;}

/* Set maximum height for archive featured images */.archive .post-thumbnail img {	max-height: 300px;	width: auto;}

/* Hide featured images on Categories */.category .post-thumbnail {	display: none;}

/* Hide featured images on archives .archive .post-thumbnail {	display: none;}*//*reduce value of line height in blockquote - original value was 1.636364em */blockquote {	line-height: 1.5em;
	/*change this value if you must*/}

/*reduce the white space for the hamburger menu*/@media only screen and (max-width: 1020px) {	/*reduce the white space for the hamburger menu*/	.header-navigation {		margin: 5px 0;	}		
		
/*reduce the space for individual menus when collapsed to hamburger*/	.primary-navigation .menu-primary > ul > li {		margin-bottom: 10px;	}}

/*Reduce spacing between links in primary menu*/.navigation-classic .primary-navigation .menu-primary > ul > li > a {	padding: 12px 7px;}

/* Search results page changed to the Full Width template. */.search #secondary {	display: none;}.search #primary {	width: 85%;	margin-right: 0;}

/* widens the menu area and decreases the font*/.primary-navigation .menu-primary {	margin-right: 10px;	margin-left: 10px;	width: 100%;	font-size: 12px;}

/* increases width of main menu*/@media screen and (min-width: 1020px) {	.navigation-classic .menu-secondary {		width: 1145px;	}}/* Increases the font size of post titles on recent posts view - not sure where else */.display-posts-listing .title {	font-size: 125%;}

/* Changed font size specifically because Reply Comment Prompt was too large. Not sure what else uses the h3 tag. */h3 {	margin: 0 auto 16px;	font-size: 1em;	line-height: 2em;}

/* Reduce line height spacing in static front page about area showing avatar */.hero .entry-content {	
	font-size: 1.125em;	
	line-height: 120%;
	padding-top: 15px ;
	padding-bottom: 15px ;
}

/*following puts puzzle image behind about text and avatar on static home page  */
body[class*="front-page"] .hero {
   background: url(https://pragmaticcompendium.com/wp-content/uploads/2020/02/BluePuzzleOverlay70PercentTransparent2000x1340.jpg);
}

/* Reduce spacing between bottom of header image and top of Frontpage. Was originally set to 180 */
.hero.without-featured-image, body[class*="front-page"] .hero {	padding: 30px 0;}.content-area {	padding-top: 10px;}

/*Hide giant featured image on post pages only while leaving the featured image of the about page for the static front page*/.page .hero.with-featured-image {	display: none;}

/* Change Font Size for Paragraph */p {	font-size: 1rem !important;}

/* Increase Content Width for Post Pages */@media screen and (min-width: 1024px) {	.no-sidebar .content-area {		width: 900px;	}}

/* Change alignment of sidebar menu from left to right*/#secondary {	text-align: right;}

/* in display post, align thumbnail image floating */
.display-posts-listing .alignleft {	float: right;	margin: 0 0 5px 5px;}

/* hide featured image on top of post pageswrong code in comment below followed by good code.single.featured-image {	display: none;}*/
.single .post-thumbnail {	display: none;}

/* hide featured image from posts displayed in chronological feed .post-thumbnail {	display: none;}*//* Display spacing between posts listed with [display post] code */.display-posts-listing .listing-item {	clear: both;	padding-bottom: 10px;}

/* Removes underline on links - border-bottom: none is used to remove underline on social media icons, but it also removes underlines on links in the static page area with my avatar. color: rgba is used to color the links instead - and I bolded them in the page. */
.entry-content a:not([class^="button"]), .page-content a:not([class^="button"]) {	border-bottom: none;	}

/* Removes underline on links - used to remove underline on social media icons, but it also removes underlines on links in the static page area with my avatar so I bolded the links. *//* Comment  *//*.display-posts-listing img {	float: left;	margin: 0 10px 10px 0;}.display-posts-listing .title {	font-size: 125%;*/

.site-footer {
   background: #e3e9f0;
}
.footer-widget-area {
   background: url(https://pragmaticcompendium.com/wp-content/uploads/2020/02/BluePuzzleOverlay70PercentTransparent2000x1340.jpg);
}

/* remove white space above menu | #19875713-hc eD */
.site-branding {
	display: none;
}

/* changes preformatted text option to white background from grey and left aligns text by removing the padding. example of inline edit for color and size in post 19939 */
pre {
	overflow: auto;
	padding: 20px 20px 20px 0px;
	margin-bottom: 24px;
	max-width: 100%;
	background: #ffffff;
	word-break: normal;
}