/*
Custom Colors
-------------
On the live WordPress site these rules were generated dynamically by the
Customizer (Header Background Color + Sidebar Text Color + Background Image
settings) and injected as inline <style> blocks rather than living in a
file. They're extracted here verbatim so the exact red/yellow color scheme
is preserved, and so they can be edited in one obvious place.

Loaded last, after twentyfifteen.css and child-theme.css, so it wins the
cascade exactly as it did on the original page.
*/

/* Site background (was body.custom-background) */
body {
	background-color: #ff0000;
}

/* Header / sidebar red background */
body:before,
.site-header {
	background-color: #ff0000;
}

@media screen and (min-width: 59.6875em) {
	.site-header,
	.secondary {
		background-color: transparent;
	}

	.widget button,
	.widget input[type="button"],
	.widget input[type="reset"],
	.widget input[type="submit"],
	.widget_calendar tbody a,
	.widget_calendar tbody a:hover,
	.widget_calendar tbody a:focus {
		color: #ff0000;
	}
}

/* Sidebar text color (yellow) */
.site-title a,
.site-description,
.secondary-toggle:before {
	color: #ffff00;
}

.site-title a:hover,
.site-title a:focus {
	color: rgba(255, 255, 0, 0.7);
}

.secondary-toggle {
	border-color: rgba(255, 255, 0, 0.1);
}

.secondary-toggle:hover,
.secondary-toggle:focus {
	border-color: rgba(255, 255, 0, 0.3);
}

.site-title a {
	outline-color: rgba(255, 255, 0, 0.3);
}

@media screen and (min-width: 59.6875em) {
	.secondary a,
	.dropdown-toggle:after,
	.widget-title,
	.widget blockquote cite,
	.widget blockquote small {
		color: #ffff00;
	}

	.widget button,
	.widget input[type="button"],
	.widget input[type="reset"],
	.widget input[type="submit"],
	.widget_calendar tbody a {
		background-color: #ffff00;
	}

	.textwidget a {
		border-color: #ffff00;
	}

	.secondary a:hover,
	.secondary a:focus,
	.main-navigation .menu-item-description,
	.widget,
	.widget blockquote,
	.widget .wp-caption-text,
	.widget .gallery-caption {
		color: rgba(255, 255, 0, 0.7);
	}

	.widget button:hover,
	.widget button:focus,
	.widget input[type="button"]:hover,
	.widget input[type="button"]:focus,
	.widget input[type="reset"]:hover,
	.widget input[type="reset"]:focus,
	.widget input[type="submit"]:hover,
	.widget input[type="submit"]:focus,
	.widget_calendar tbody a:hover,
	.widget_calendar tbody a:focus {
		background-color: rgba(255, 255, 0, 0.7);
	}

	.widget blockquote {
		border-color: rgba(255, 255, 0, 0.7);
	}

	.main-navigation ul,
	.main-navigation li,
	.secondary-toggle,
	.widget input,
	.widget textarea,
	.widget table,
	.widget th,
	.widget td,
	.widget pre,
	.widget li,
	.widget_categories .children,
	.widget_nav_menu .sub-menu,
	.widget_pages .children,
	.widget abbr[title] {
		border-color: rgba(255, 255, 0, 0.1);
	}

	.dropdown-toggle:hover,
	.dropdown-toggle:focus,
	.widget hr {
		background-color: rgba(255, 255, 0, 0.1);
	}

	.widget input:focus,
	.widget textarea:focus {
		border-color: rgba(255, 255, 0, 0.3);
	}

	.sidebar a:focus,
	.dropdown-toggle:focus {
		outline-color: rgba(255, 255, 0, 0.3);
	}
}

/*
Note on scroll behavior
-----------------------
On the original WordPress site, a JavaScript scroll listener (part of the
theme's functions.js, which wasn't among the uploaded files) pinned the red
sidebar in place as you scrolled down the much-longer article, switching it
between fixed/absolute/relative positioning. That script isn't reproduced
here — `position: sticky` was tried as a CSS-only substitute, but it doesn't
combine reliably with this theme's float-based column layout, so it was
left out rather than ship something that half-works. The sidebar instead
uses the theme's original position: relative behavior: it scrolls with the
page rather than staying pinned. Visually, at rest, it's identical either
way — this only affects what happens while scrolling.
*/
