/*
 Theme Name:   Brians Web Tricks Child
 Theme URI:    https://www.brianshim.com/webtricks
 Description:  GeneratePress Child theme for Brian's Web Tricks
 Author:       Brian Shim
 Author URI:   http://brianshim.com
 Template:     generatepress
 Version:      1.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  wt
*/

/* --------------------------------------
	UNDERLINE LINKS FOR ACCESSIBILITY, BUT NOT HEADERS 
	--------------------------------------- */
body.single-post h2 a,
body.single-post h3 a,
a {
	text-decoration: underline;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	text-decoration: none;
}

#footer-widgets a {
	text-decoration: underline;
	color: #165994;
}

blockquote {
	background-color: #eee;
}

/* STOP ADS FROM OVERFLOWING ON MOBILE */
/*
#page {
	overflow: hidden;
}

p .ezoic-ad {
	margin-left: -20px;
}
*/

/* SET HEADER BACKGROUND TO MATCH BODY BACKGROUND */
.site-header {
	background-color:#e6e6e6;
}
.site-header .main-title a {
	font-weight: 500;
	color: #1e73be;
}
.site-branding .site-description {
	color: #333;
}

/* MAKE NAV BAR STICKY AND ADD SITE TITLE TO MOBILE NAV BAR */
/*
#site-navigation {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
}
*/
/*
#site-navigation .mobile-menu::before {
	content: "Webtricks ";
}
*/
/* CHANGE NAV BAR COLOR */
.main-navigation, 
main-navigation ul ul {
	background-color: #1e73be
}

#site-navigation .mobile-menu,
.wp-block-tag-cloud,
.site-branding .site-description,
.main-navigation .main-nav > ul > li > a {
	text-transform: lowercase;
}


/*
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	background-color: #2386de;
}
*/

/* TAGS */
.tags {
	text-align: center;
	font-size: 85%;
	margin-top: 6px;
}
.tags a {
	text-decoration: none;
	border: 1px solid;
	border-radius: 12px;
	padding: 0 8px 2px;
	text-transform: lowercase;
}

/* REDUCE SIZE OF INSANE GUTENBERG DROP CAPS */
p.has-drop-cap:not(:focus):first-letter {
    font-size: 4.0em;
}

/* HIDE JETPACK SMILEY FACE AT BOTTOM */
img#wpstats{display:none}

/* GUTENBERG BUTTONS */
.wp-block-button .wp-block-button__link:hover {
	background-color: transparent !important;
}

.wp-block-button__link:active, .wp-block-button__link:focus, .wp-block-button__link:hover, .wp-block-button__link:visited {
	color: #1e73be;
}

/* COMMENT BUTTONS */
input[type="submit"] {
	border-color: var(--accent);
  border-width: 2px;
}


/* ---------------------------------------------------
		GENERATEPRESS
	 --------------------------------------------------- */

.main-title,
.widget ul li {
	    font-family: "Oswald", sans-serif;
}

.main-navigation .main-nav ul li a, .menu-toggle, .main-navigation .menu-bar-items {
    color: #ffffff;
    font-family: 'Oswald';
    font-size: 18px;
}

#masthead a {
    /* text-transform: uppercase; */
		font-family:Arial, Helvetica, sans-serif;
}

/* SHOW MODIFIED DATE INSTEAD OF CREATED DATE 
	 https://generatepress.com/forums/topic/display-last-updated-date-instead-of-published-date/
*/

.entry-meta time.updated {
    display: block;
}
.entry-meta time.updated::before {
	content: "Updated ";
}
.entry-meta time.published::before {
	content: "Published ";
}
/*
.entry-meta time.published {
    display: none;
}
*/

/* MAKE ALL FEEDS TWO-COLUMN */
.archive article,
.home article {
	width: calc(50% - 10px);
}
.archive article:nth-of-type(even),
.home article:nth-of-type(even) {
	float: right;
	clear: right;	
}
.archive article:nth-of-type(odd),
.home article:nth-of-type(odd) {
	float: left;
	clear: left;
}
@media only screen and (max-width: 600px) { 
	.archive article,
	.home article {
	width: 100%;
}
.archive article:nth-of-type(even),
.home article:nth-of-type(even) {
	float: none;
}
.archive article:nth-of-type(odd),
.home article:nth-of-type(odd) {
	float: none;
}
}
.archive #nav-below,
.home #nav-below {
	clear: both;
}

.home article .entry-summary,
.archive article .entry-summary {
	display: none;
}

/* HIDE AUTHOR IN BLOG FEEDS */
.inside-article .byline,
.inside-article footer.entry-meta {
	display: none;
}


/* DECREASE BOX PADDING GLOBALLY */
.inside-header,
.widget-area .widget,
.separate-containers .comments-area, .separate-containers .inside-article, .separate-containers .page-header, .separate-containers .paging-navigation {
	padding: 20px;
}

/* REMOVE PADDING AROUND POST FEATURED IMAGES */
@media only screen and (max-width: 920px) { 
	.one-container .inside-article>[class*=page-header-], .separate-containers .inside-article>[class*=page-header-] {
		margin-left: -20px !important;
		margin-right: -20px !important;
		margin-top: -20px !important;
	}
}

/* GET RID OF TOP AND BOTTOM GUTTERS ON MOBILE */
@media only screen and (max-width: 1220px) { 
	.single-post.separate-containers .site-main {
    margin-bottom: 0px;
		margin-top: 0;
	}
}

/* ADD SPACE UNDER MOVED COMMENT FORM */
.comment-respond {
	margin-bottom: 2em;
}

/* ADD BORDER TO BODY IMAGES */
.wp-block-image img {
	border: 2px solid #ddd;
}

/* GENERAL PUPROSE */
.clearfloat {
	clear: both;
}

/* ADS */
.top-box,
.bottom-box {
	text-align: center;
	/* min-height: 278px; */
}
.top-box {
	margin-bottom: 1em;
}
.affiliate-ad-link {
	text-align: center;
	font-size: 14px;
	font-style: italic;
}


/* CODE BLOCK FORMATTING */
pre {
	background-color: #ddd;
	margin-top: 1em;
}
pre,
code,
pre code {
	font-family: 'Courier New', Courier, monospace;
}

/* SET DARKER FOOTER WIDGET AREA BACKGROUND COLOR */
#footer-widgets {
	background-color: #ccc;
}

.footer-widgets .widget-title {
	margin-bottom: 10px;
}

/* HIDE FOOTER; NOT NEEDED */
footer.site-info {
	display: none;
}


/* CENTER TITLE AND FEATURED IMAGE ON POSTS */
.single-post #main .featured-image {
	text-align: center;
}
.single-post #main header.entry-header {
	text-align: center;
}
.single-post #main .featured-image {
	max-width: 880px;
	margin-left:auto;
	margin-right: auto;
}

/* HTML TWEAKS */
ol, ul {
	padding-left: 2em;
}
figcaption {
	text-align: center;
    font-style: italic;
    font-size: 80%;
}

/* MAKE TEXT AND ALMOST EVERYTHING ELSE NARROW ON POSTS */
blockquote.wp-block-quote,
figure.wp-block-table,
.single-post #main figure.wp-block-pullquote,
.single-post #main .sharedaddy, 
.single-post #main .saboxplugin-wrap,
.single-post #main .et_social_inline,
.single-post #main h2,
.single-post #main h3,
.single-post #main h4,
.single-post #main h5,
.single-post #main h6,
.single-post #main ol,
.single-post #main ul,
.single-post #main em,
.single-post #main div.audio-player,
.single-post #main pre,
.single-post #main p {
	max-width:820px;
	margin-left: auto;
	margin-right: auto;
}

/* MAKE IMAGES SLIGHTLY WIDER THAN TEXT */
.single-post #main figure.wp-block-jetpack-image-compare,
.single-post #main .wp-block-columns.has-background,
.single-post #main hr.wp-block-separator,
.single-post #main figure.wp-block-gallery,
.single-post #main .wp-block-jetpack-tiled-gallery,
.single-post #main .wp-block-image,
.ezoic-ad {
	max-width: 820px;
	margin-left: auto;
	margin-right: auto;
}

/* SET AD WIDTH */
.top-box,
.middle-box,
.bottom-box {
	max-width: 970px;
	margin-left: auto;
	margin-right: auto;
}

/* MAKE PORTRAIT ROUND */
.saboxplugin-wrap .saboxplugin-gravatar img {
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 50%;
}



/* ================================== */
/* WP 3.6 Native Audio Player styling */
/* ================================== */

/* change the color of the background */
.basic .mejs-controls,
.basic .mejs-mediaelement,
.basic .mejs-container {
	background: url('') !important;
	background-color: #C8E1FA !important;
}

/* change the color of the lettering */
.basic .mejs-currenttime,
.basic .mejs-duration {
	color: black !important;
}

/* eliminate the yellow border around the play button during playback */
.basic .mejs-controls .mejs-button button:focus {
outline: none !important;
}

/* use a sprite file with darker transport icons */
.basic.step2 .mejs-controls .mejs-button button {
	background-image: url('http://www.brianshim.com/demos/mejs-controls-dark.svg') !important;
}
 
/* change the color of the progress bar */
.basic.step2 .mejs-controls .mejs-time-rail .mejs-time-total {
	background: #AAC7E3 !important;
}
 
/* change the color of the current time bar */
.basic.step2 .mejs-controls .mejs-time-rail .mejs-time-current {
	background: #00a !important;
}
 
/* change the color of the file loading bar */
.basic.step2 .mejs-controls .mejs-time-rail .mejs-time-loaded {
	background: #ccc !important;
}

/*
.basic .audio-controls {
	display: none;
}
*/

.basic .audio-even .mejs-controls {
	background-color: aquamarine !important;
}

/* LAZY BLOCK CHECKLIST */
ul.lazy-block-checklist {
	margin-bottom: 1em !important;
	padding-left: 20px;
	margin-left: 0px;
}
ul.lazy-block-checklist li {
	list-style: none;
	font-size: large;
	margin-bottom: 1em;
}
ul.lazy-block-checklist li label {
	cursor: pointer;
	user-select:none;
	font-weight: bold;
}
ul.lazy-block-checklist li input {
	width: 22px;
	height: 22px;
	vertical-align: top;
	margin-right: 10px;
	cursor: pointer;
}
ul.lazy-block-checklist li label .label {
	display: inline-block;
	width: calc(100% - 50px);
}
ul.lazy-block-checklist li .label div {
	font-weight: normal;
}