/*!
Theme Name: Campaign Pro
Theme URI: https://campaignpro.net/
Author: Going Bold
Author URI: https://goingbold.co.uk/
Description: The essential toolbox of fresh and innovative solutions needed for an effective and powerful campaign.
Version: 1.1.7
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: campaign-pro
Tags: accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, translation-ready, theme-options

This theme, like WordPress, is licensed under the GPL.
Use it to create an amazing campaign, have fun, and if you need a hand get in touch at 'help@campaignpro.net'.

Campaign Pro is proudly based on lots of awesome open source tech. Please see readme for credits and
other useful information.

Campaign Pro (C) 2017-2019 GoingBold, Ltd.
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1 Fonts (once upon a time custom fonts were going to be included, maybe one day...)
2 Normalize
3 Globals
	3.1 Multi-Selector Styling
		3.1.1 Multiple Selector Categories (e.g. a block and an element)
			3.1.1.1 Responsive
		3.1.2 Blocks
		3.1.3 Elements
		3.1.4 Links
			3.1.4.1 Responsive
	3.2 Typography
		3.2.1 Responsive
	3.3 Blocks
		3.3.1 Responsive
	3.4 Elements
		3.4.1 Responsive
	3.5 Forms
		3.5.1 Uniform (see: github.com/AudithSoftworks/Uniform)
	3.6 Navigation
		3.6.1 Links
		3.6.2 Menus
			3.6.2.1 Header (check responsive styles)
				3.6.2.1.1 Responsive
			3.6.2.2 Header Smart Menu Styles
				3.6.2.2.1.1 Responsive
		3.6.3 Pagination
			3.6.3.1 Blocks
			3.6.3.2 Elements
			3.6.3.3 Links
		3.6.4 Breadcrumb
			3.6.4.1 Responsive
	3.7 Accessibility
	3.8 Alignments
	3.9 Clearings (contains donation block and img block clearings)
	3.10 Widgets
		3.10.1 Typography
		3.10.2 Blocks
		3.10.3 Elements
		3.10.4 Forms
		3.10.5 Links
	3.11 Posts
		3.11.1 Blocks
		3.11.2 Links
	3.12 Content
		3.12.1 Posts and pages
			3.12.1.1 Blocks
				3.12.1.1.1 Responsive
			3.12.1.2 Links
			3.12.1.3 Forms
				3.12.1.3.1 Responsive
		3.12.2 Attachment Pages
			3.12.2.1 Typography
			3.12.2.3 Elements
			3.12.2.4 Media
		3.12.3 Search result page
			3.12.3.1 Typography
			3.12.3.2 Blocks
				3.12.3.2.1 Responsive
		3.12.4 404 and 'Nothing Found' pages
		3.12.5 Comments
			3.12.5.1 Typography
			3.12.5.2 Blocks
			3.12.5.3 Elements
			3.12.5.4 Links
			3.12.5.5 Forms
			3.12.5.6 Media
		3.12.6 Share links (at bottom of content)
			3.12.6.1 Typography
			3.12.6.2 Links
	3.13 Infinite scroll
	3.14 Media
		3.14.1 Captions
		3.14.2 Galleries
			3.14.2.1 Responsive
4 Header
	4.1 Typography
	4.2 Blocks
		4.2.1 Responsive
	4.3 Elements
		4.3.1 Responsive
	4.4 Links
		4.4.1 Responsive
	4.5 Forms
		4.5.1 Responsive
	4.6 Donations
		4.6.1 Typography
		4.6.2 Blocks
			4.6.2.1 Responsive
		4.6.3 Links
		4.6.4 Forms
5 Footer
	5.1 Typography
		5.1.1 Responsive
	5.2 Blocks
		5.2.1 Responsive
	5.3 Elements
		5.3.1 Responsive
	5.4 Links
		5.4.1 Responsive
6 Modules
	6.1 Multi-Selector Styling (between modules ONLY, anything that includes globals will be in 'Multi-Selector Styling' in globals
		6.1.1 Multiple Selector Categories (e.g. a block and an element)
		6.1.2 Blocks
			6.1.2.1 Responsive
	6.2 Hero
		6.2.1 Typography
			6.2.1.1 Responsive
		6.2.2 Blocks
			6.2.2.1 Responsive
		6.2.3 Links
	6.3 Accordions
		6.3.1 Blocks
			6.3.1.1 Responsive
		6.3.2 Elements
			6.3.2.1 Responsive
		6.3.3 Links (inc Buttons)
			6.3.3.1 Responsive
	6.4 Image (styles removed as now using Gutenberg images)
	6.5 Text
		6.5.1 Typography
			6.5.1.1 Responsive
	6.6 Stats
		6.6.1 Blocks
			6.6.1.1 Responsive
		6.6.2 Elements
			6.6.2.1 Responsive
			6.6.2.2 Big Text Sizes (there's quite a lot of them)
				6.6.2.2.1 Three Per Row
					6.6.2.2.1.1 Standard
						6.6.2.2.1.1.1 Responsive
					6.6.2.2.1.2 Wide
						6.6.2.2.1.2.1 Responsive
					6.6.2.2.1.3 Full Width
						6.6.2.2.1.3.1 Responsive
				6.6.2.2.2 Two Per Row
					6.6.2.2.2.1 Standard
						6.6.2.2.2.1.1 Responsive
					6.6.2.2.2.2 Wide
						6.6.2.2.2.2.1 Responsive
					6.6.2.2.2.3 Full Width
						6.6.2.2.2.3.1 Responsive
				6.6.2.2.3 One Per Row
					6.6.2.2.3.1 Responsive
	6.7 Alert
		6.7.1 Blocks
		6.7.2 Elements
			6.7.2.1 Responsive
		6.7.3 Links
			6.7.3.1 Responsive
	6.8 Display Forms (also includes cf7 styles)
		6.8.1 Typography
		6.8.2 Blocks
		6.8.3 Elements
		6.8.4 Forms
	6.9 Donations
		6.9.1 Typography
		6.9.2 Blocks
			6.9.2.1 Responsive
		6.9.3 Elements
		6.9.4 Forms
		6.9.5 Stripe Payments (WP Plugin)
	6.10 Section
		6.10.1 Typography
			6.10.1.1 Responsive
		6.10.2 Blocks
			6.10.2.1 Responsive
		6.10.3 Links
	6.11 Show (Show Posts/Events/Campaigns)
		6.11.1 Typography
		6.11.2 Elements
			6.11.2.1 Responsive
		6.11.3 Links
		6.11.4 Media
	6.12 Big Text
		6.12.1 Typography
		6.12.2 Blocks
			6.12.2.1 Responsive
	6.13 Grid
		6.13.1 Typography
		6.13.2 Blocks
			6.13.2.1 Responsive
		6.13.3 Elements
		6.13.4 Links
	6.14 Action
		6.14.1 Typography
			6.14.1.1 Responsive
		6.14.2 Blocks
			6.14.2.1 Responsive
	6.15 Video
		6.15.1 Typography
			6.15.1.1 Responsive
		6.15.2 Blocks
			6.15.2.1 Responsive
		6.15.3 Elements
			6.15.3.1 Responsive
		6.15.4 Links (inc Buttons)
		6.15.5 Media
	6.16 Default Gutenberg Blocks/Modules (any that aren't styled via any of the css above)
		6.16.1 Image and Gallery
			6.16.1.1 Elements
				6.16.1.1.1 Responsive
		6.16.2 Cover
			6.16.2.1 Typography
		6.16.3 Audio
			6.16.3.1 Elements
		6.16.4 Button
		6.16.5 Columns
		6.16.6 Align Wide and Align Full
			6.16.6.1 Responsive
		6.16.7 Align Right/Left
	6.17 Conditional Margins (margins in particular circumstances only, like when a certain block comes after another)
7 Misc - for the stuff that doesn't quite fit anywhere else
	7.1 No js message - displayed if js disabled
	7.2 Twitter embed thingy
	7.3 Plugins - styles for popular plugins here
--------------------------------------------------------------*/
/*--------------------------------------------------------------
2 Normalize
Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css
--------------------------------------------------------------*/
html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

a:active,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
3 Globals
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.1 Multi-Selector Styling
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.1.1 Multiple Selector Categories (e.g. a block and an element)
--------------------------------------------------------------*/
/* everything that looks and feels like a button */
.a--cp-btn,
.a--cp-hero,
.a--cp-section,
.a--cp-alert,
.ul--cp-show-posts__a,
.a--cp-grid,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.comment-edit-link,
.comment-reply-link,
#cancel-comment-reply-link,
.cp-menu-toggle,
.more-link,
.entry-footer a,
.wp-block-button .wp-block-button__link {
	padding: 17px 48px;
	display: inline-block;
	background: #87bc52;
	color: #000;
	text-transform: uppercase;
	font-weight: 700;
	border: 0;
	text-align: center;
	-webkit-appearance: none; /* Removes ios styling */
	border-radius: 0; /* Removes ios styling */
}

/* hover, focus and active styles for buttons (declarations above) */
.a--cp-btn:hover, .a--cp-btn:active, .a--cp-btn:focus,
.a--cp-hero:hover, .a--cp-hero:active, .a--cp-hero:focus,
.a--cp-section:hover, .a--cp-section:active, .a--cp-section:focus,
.a--cp-alert:hover, .a--cp-alert:active, .a--cp-alert:focus,
.ul--cp-show-posts__a:hover, .ul--cp-show-posts__a:active, .ul--cp-show-posts__a:focus,
.a--cp-grid:hover, .a--cp-grid:active, .a--cp-grid:focus,
button:hover, button:active, button:focus,
input[type="button"]:hover, input[type="button"]:active, input[type="button"]:focus,
input[type="reset"]:hover, input[type="reset"]:active, input[type="reset"]:focus,
input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus,
.comment-edit-link:hover, .comment-edit-link:active, .comment-edit-link:focus,
.comment-reply-link:hover, .comment-reply-link:active, .comment-reply-link:focus,
#cancel-comment-reply-link:hover, #cancel-comment-reply-link:active, #cancel-comment-reply-link:focus,
.cp-menu-toggle:hover, .cp-menu-toggle:active, .cp-menu-toggle:focus,
.more-link:hover, .more-link:active, .more-link:focus,
.entry-footer a:hover, .entry-footer a:active, .entry-footer a:focus,
.wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:active, .wp-block-button .wp-block-button__link:focus {
	background: #5b882f;
	color: #fff;
}

.entry-content > * /* sets the default margin for most things in the_content */,
#content form,
.entry-footer,
.entry-meta,
.nav-links,
.page-links,
.main-navigation,
.widget-area__container,
.wp-block-image.alignfull figcaption,
.alignfull .cp-alert__content-wrapper,
.entry-content > .aligncenter /* aligncenter class has margin: auto, which this overwrites */,
.wp-block-column > * {
	margin: 0 6.5% 1.5em;
}

.site-footer__main,
.site-footer__colophon,
.site-header__supplementary,
.site-footer__supplementary,
.section--cp-big-text.alignfull,
.cp-stats.alignfull {
	padding: 0 6.5%;
}

.cp-accordion__header > span:before,
.cp-alert__content-wrapper:before,
.nav-next a:before,
.nav-previous a:before,
span.wpcf7-not-valid-tip:before,
.wpcf7-response-output:before,
.site-header__supplementary__btn--search-js:before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 45px;
	width: 45px;
	background-image: url(assets/img/cp-main-icon-sprite.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/cp-main-icon-sprite.svg);
	background-repeat: no-repeat;
}

/*--------------------------------------------------------------
3.1.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.entry-content > * /* sets the default margin for most things in the_content */,
	#content form,
	.entry-footer,
	.entry-meta,
	.nav-links,
	.page-links,
	.main-navigation,
	.widget-area__container,
	.wp-block-image.alignfull figcaption,
	.alignfull .cp-alert__content-wrapper,
	.entry-content > .aligncenter /* aligncenter class has margin: auto, which this overwrites */,
	.wp-block-column > * {
		margin: 0 10% 1.5em;
	}

	.site-footer__main,
	.site-footer__colophon,
	.site-header__supplementary,
	.site-footer__supplementary,
	.cp-stats.alignfull .cp-stats__stat--full	{
		padding: 0 10%;
	}
}

@media (min-width: 768px) {
	.entry-content > * /* sets the default margin for most things in the_content */,
	#content form,
	.entry-footer,
	.entry-meta,
	.nav-links,
	.page-links,
	.widget-area__container,
	.wp-block-image.alignfull figcaption,
	.alignfull .cp-alert__content-wrapper,
	.entry-content > .aligncenter /* aligncenter class has margin: auto, which this overwrites */,
	.wp-block-column > * {
		margin: 0 18% 1.5em;
	}

	.site-footer__main,
	.site-footer__colophon,
	.site-footer__supplementary,
	.cp-stats.alignfull .cp-stats__stat--full	{
		padding: 0 18%;
	}
}

@media (min-width: 1120px) {
	.entry-content > * /* sets the default margin for most things in the_content */,
	#content form,
	.entry-footer,
	.entry-meta,
	.nav-links,
	.page-links,
	.main-navigation,
	.widget-area__container,
	.wp-block-image.alignfull figcaption,
	.alignfull .cp-alert__content-wrapper,
	.entry-content > .aligncenter /* aligncenter class has margin: auto, which this overwrites */,
	.wp-block-column > * {
		margin: 0 25% 1.5em;
	}

	.hfeed .hentry .entry-content > *,
	.hfeed #content .hentry form,
	.hfeed #content .hentry .entry-footer,
	.hfeed .hentry .entry-meta,
	.hfeed .hentry .wp-block-image.alignfull figcaption,
	.hfeed .hentry .alignfull .cp-alert__content-wrapper,
	.hfeed .hentry .entry-content > .aligncenter,
	.hfeed .hentry .wp-block-column > * {
		margin: 0 15% 1.5em;
	}

	.site-footer__main,
	.site-footer__colophon,
	.site-footer__supplementary,
	.cp-stats.alignfull .cp-stats__stat--full	{
		padding: 0 25%;
	}
}

/*--------------------------------------------------------------
3.1.2 Blocks
--------------------------------------------------------------*/
.site-header__supplementary,
.site-footer__supplementary {
	background: #eee;
	position: relative;
	height: 29px;
	border-bottom: 1px solid #ccc;
	overflow: hidden;
}

.blog.hfeed .hentry:before,
.archive .hentry:before,
.cp-donations__column-cards > div:before,
.cp-donations--block:before,
.cp-donations--cards > .cp-donations__column-full:before,
#content .cp-donations--quick__pop-up__container:before,
.site-footer__colophon__built-with-msg:before,
.cp-donations--quick:before,
.ul--cp-show-posts__li:before,
.cp-video:before,
.cp-video__play-symbol:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: #ffffff;
	z-index: -1;
	left: 0;
	right: 0;
	margin: auto;
	transform: rotate(-1deg);
	bottom: 0;
	border: 2px solid #ccc;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
}

/*--------------------------------------------------------------
3.1.3 Elements
--------------------------------------------------------------*/
.wp-block-image figcaption,
.wp-caption-text {
	display: block;
	position: relative;
	font-size: .8em;
	padding: 10px 10px 10px 31px;
	border-left: 1px solid #eee;
	text-align: left;
}

.wp-block-image figcaption:before,
.cp-stats__span--small-text:before,
.wp-caption-text:before,
.p--cp-video-description:before {
	content: '';
	position: absolute;
	left: 10px;
	height: 18px;
	width: 12px;
	background-color: #cecece;
	top: 10px;
}

.cp-stats__span--small-text:before,
.p--cp-video-description:before {
	left: 0;
}

/*--------------------------------------------------------------
3.1.4 Links
--------------------------------------------------------------*/
.site-footer__supplementary__btn {
	background: #f00;
	color: #fff;
	padding: 8px 17px;
	text-transform: uppercase;
	text-align: center;
	font-size: .7em;
	font-weight: 700;
	display: inline-block;
	position: relative;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
}

.site-footer__supplementary__btn > span {
	position: relative;
	z-index: 1;
}

.site-header__cta__btn--dark-background:hover:before,
.site-header__cta__btn--dark-background:active:before,
.site-header__cta__btn--dark-background:focus:before,
.site-footer__supplementary__btn--dark-background:hover:before,
.site-footer__supplementary__btn--dark-background:active:before,
.site-footer__supplementary__btn--dark-background:focus:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.25);
}

.site-header__cta__btn--bright-background:hover:before,
.site-header__cta__btn--bright-background:active:before,
.site-header__cta__btn--bright-background:focus:before,
.site-footer__supplementary__btn--bright-background:hover:before,
.site-footer__supplementary__btn--bright-background:active:before,
.site-footer__supplementary__btn--bright-background:focus:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.25);
	
}

.more-link {
	width: 70%;
	margin-left: 15%;
	font-size: .7em;
	background: none;
	border-top: 2px solid;
}

#content .a--entry-footer-fb,
#content .a--entry-footer-twitter,
.a--cp-grid--fb,
.a--cp-grid--twitter {
	padding: 0;
	width: 32px;
	height: 32px;
	background-color: #3b5998;
	background-image: url(assets/img/social-icons/png/social-icon_facebook.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_facebook.svg);
	background-repeat: no-repeat;
	background-position: center;
	border: 2px solid #eee;
	border-radius: 50%;
}

#content .a--entry-footer-twitter,
.a--cp-grid--twitter {
	background-color: #00aced;
	background-position: center;
	background-image: url(assets/img/social-icons/png/social-icon_twitter.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_twitter.svg);
}

#content .p--share-wrapper a:hover,
#content .p--share-wrapper a:active,
#content .p--share-wrapper a:focus,
.cp-grid__block__p--share-wrapper a:hover,
.cp-grid__block__p--share-wrapper a:active,
.cp-grid__block__p--share-wrapper a:focus {
	background-color: midnightblue;
}

/*--------------------------------------------------------------
3.1.4.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.site-footer__supplementary__btn {
		padding: 12px 25px;
		font-size: .8em;
	}
}

/*--------------------------------------------------------------
3.2 Typography
--------------------------------------------------------------*/
body {
	color: #404040;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.8;
}

#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6 {
	clear: both;
	margin: 0.67em 6.5%;
	line-height: 1.4em;
}

h1 {
	font-size: 2em;
}

h2 {
	font-size: 1.45em;
}

h3 {
	font-size: 1.15em;
}

h4 {
	font-size: 1.05em;
}

h5 {
	font-size: .9em;
}

h6 {
	font-size: .8em;
}

/* The 'main' p */
#content p,
#content blockquote,
#content address,
#content pre {
	margin: 0 6.5% 1.5em;
}

/* p that is in a form (e.g. a contact form), as forms have their own margin, left and right margins are not needed */
#content form p {
	margin-right: 0;
	margin-left: 0;
	position: relative;
}

/* Used for contact forms (e.g. terms text) so may move it to specific block section rather than in globals */
.p--small-text {
	font-size: .7em;
}

dfn, cite, em, i {
	font-style: italic;
}

blockquote {
	padding: 0 30px;
	border-left: 3px solid;
	margin-bottom: 1.5em;
}

/* no margin for any children as margin applied to parent */
body #content blockquote *,
body #content pre * {
	margin: 0;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
	padding: 20px;
}

code, kbd, tt, var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}

abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
	text-decoration: none;
}

mark, ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
3.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content h1,
	#content h2,
	#content h3,
	#content h4,
	#content h5,
	#content h6 {
		clear: both;
		margin: 0.67em 10%;
	}

	h1 {
		font-size: 2.2em;
	}

	h2 {
		font-size: 1.5em;
	}

	h3 {
		font-size: 1.2em;
	}

	#content p,
	#content blockquote,
	#content address,
	#content pre {
		margin: 0 10% 1.5em;
	}

	.p--col-third--last {
		width: 33%;
		float: right;
	}

	.p--col-two-thirds {
		width: 65%;
		float: left;
	}

	.p--col-half {
		width: 49%;
		float: left;
	}

	.p--col-half--right {
		width: 49%;
		float: right;
	}

	.p--col-full {
		float: right;
		width: 100%;
	}
}

@media (min-width: 768px) {
	body {
		font-size: 19px;
		font-size: 1.15rem;
	}

	/**
	 * font-size goes from 1rem to 1.15 rem on 768px+, to avoid this increase in font size, put relevant selectors here
	 * n.b. where possible accommodate the font-size increase
	 * */
	#masthead,
	#colophon {
		font-size: .85em;
	}

	#content h1,
	#content h2,
	#content h3,
	#content h4,
	#content h5,
	#content h6 {
		clear: both;
		margin: 0.67em 18%;
	}

	h1 {
		font-size: 2.5em;
	}

	h2 {
		font-size: 1.7em;
	}

	h3 {
		font-size: 1.25em;
	}

	#content p,
	#content blockquote,
	#content address,
	#content pre {
		margin: 0 18% 1.5em;
	}
}

@media (min-width: 1120px) {
	#content h1,
	#content h2,
	#content h3,
	#content h4,
	#content h5,
	#content h6 {
		clear: both;
		margin: 0.67em 25%;
	}

	.hfeed #content .hentry .entry-content > h1,
	.hfeed #content .hentry .entry-header > h1,
	.hfeed #content .hentry .entry-content > h2,
	.hfeed #content .hentry .entry-content > h3,
	.hfeed #content .hentry .entry-content > h4,
	.hfeed #content .hentry .entry-content > h5,
	.hfeed #content .hentry .entry-content > h6 {
		margin: 0.67em 15%;
	}

	h1 {
		font-size: 3em;
	}

	h2 {
		font-size: 2em;
	}

	h3 {
		font-size: 1.5em;
	}

	h4 {
		font-size: 1.2em;
	}

	h5 {
		font-size: 1em;
	}

	h6 {
		font-size: .85em;
	}

	#content p,
	#content blockquote,
	#content address,
	#content pre {
		margin: 0 25% 1.5em;
	}

	.hfeed #content .hentry .entry-content > p,
	.hfeed #content .hentry .entry-content > blockquote,
	.hfeed #content .hentry .entry-content > address,
	.hfeed #content .hentry .entry-content > pre {
		margin: 0 15% 1.5em;
	}
}

/*--------------------------------------------------------------
3.3 Blocks
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after {
	/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #fff; /* Fallback for when there is no custom background color defined. */
	max-width: 1450px;
	margin: 0 auto;
	overflow-x: hidden; /* Added as header donations goes slightly beyond container due to rotate */
}

#content {
	position: relative; /* needed as sidebar/widget area is absolutely positioned on desktop */
	-ms-word-wrap: break-word;
		word-wrap: break-word;
}

.entry-footer {
	position: relative;
}

/* Multi-Selector, Search: '.entry-footer' */

/**
 * Fixes the background images. Used in the Hero, Section,
 * Take Action, Grid and Video blocks.
 */
.cp-fixed-background {
	background-attachment: fixed;
}

/*--------------------------------------------------------------
3.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 1540px) {
	html {
		background-color: #e9eaee;
	}

	body {
		border-left: 1px solid #cccccc;
		border-right: 1px solid #cccccc;
		position: relative;
		z-index: 1;
	}
}

@media (max-width: 1449px) {
	/* the header cta button pseudo background can extend content if button is wide */
	#page {
		overflow: hidden;
	}
}

@supports (-webkit-overflow-scrolling: touch) {
	.cp-fixed-background {
		background-attachment: scroll;
	}
}

/*--------------------------------------------------------------
3.4 Elements
--------------------------------------------------------------*/
.entry-content hr {
	border: none;
	border-bottom: 2px solid #8f98a1;
	height: 0;
	margin: auto auto 1.5em;
	max-width: 87%;
}

.entry-content hr.is-style-default {
	max-width: 100px;
}

ul, ol {
	margin: 0 0 1.5em 3em;
}

/* The 'main' ul and ol */
#content ul,
#content ol {
	margin: 0 6.5% 1.5em;
}

/* nested ul's and ol's */
#content ul ul,
#content ol ol,
#content ul ol,
#content ol ul {
	margin: 0;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

/* Multi-Selector, Search: 'dl' */

/* Gutenberg block style, makes lists look more like a table of contents */
.is-style-cp-table-of-contents {
	counter-reset: listNumbering;
	padding-left: 26px;
}

/* Gutenberg block style, makes lists look more like a table of contents */
.is-style-cp-table-of-contents > li {
	list-style: none;
	border-left: 1px solid;
	counter-increment: listNumbering;
	position: relative;
	padding-left: 13px;
}

/* Gutenberg block style, makes lists look more like a table of contents */
.is-style-cp-table-of-contents > li:before {
	content: counter(listNumbering) '.';
	font-size: .8em;
	margin-left: -42px;
	position: absolute;
	top: 6px;
}

dt {
	font-weight: bold;
	clear: left;
}

dd {
	margin: 0;
	padding: .5em 0;
}

dd {
	padding-left: 1em;
}

dd + dd {
	float: right;
	clear: both;
}

dt:first-child {
    padding-top: .5em;
}

dd + dt {
	clear: both;
	padding-top: .5em;
}

dt + dt {
	width: 100%;
	float: none;
	padding: 0 70% 0 0;
}

dt + dt + dd {
	margin-top: -2em;
}

dt + dt + dd + dt {
	margin-top: 2em;
}

img {
	height: auto;
	/* Make sure images are scaled correctly. */
	max-width: 100%;
	/* Adhere to container width. */
}

figure {
	margin: 0 auto;
	/* Extra wide images within figure tags don't overflow the content area. */
}

table {
	border-collapse: collapse;
}

/* Forms have their own margin so no need for table to have one when child of form */
form table {
	margin: 0;
	width: 100%;
}

/* Multi-Selector, Search: 'table' */

th, td {
	padding: 12px 12px 12px 0;
	border-bottom: 1px solid #ddd;
	text-align: center;
}

/*--------------------------------------------------------------
3.4.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content ul,
	#content ol {
		margin: 0 10% 1.5em;
	}

	.entry-content hr {
		max-width: 80%;
	}
}

@media (min-width: 768px) {
	#content ul,
	#content ol {
		margin: 0 18% 1.5em;
	}

	dt {
		font-weight: bold;
		text-align: right;
		font-weight: bold;
		clear: left;
		float: left;
	}

	dt, dd {
		display: inline-block;
		width: 30%;
	}

	dd {
		width: 70%;
		padding-left: 1em;
		clear: right;
	}

	.entry-content hr {
		max-width: 64%;
	}
}

@media (min-width: 1120px) {
	#content ul,
	#content ol {
		margin: 0 25% 1.5em;
	}

	.hfeed #content .hentry .entry-content > ul,
	.hfeed #content .hentry .entry-content > ol {
		margin: 0 15% 1.5em;
	}

	.entry-content hr {
		max-width: 50%;
	}

	.hfeed .hentry .entry-content hr {
		max-width: 70%;
	}
}

/*--------------------------------------------------------------
3.5 Forms
--------------------------------------------------------------*/
/* Multi-Selector, Search: 'form' */
/* Multi-Selector, Search: 'button' */
/* Multi-Selector, Search: 'input[type="button"]' */
/* Multi-Selector, Search: 'input[type="reset"]' */

input[type="submit"] {
	width: 100%;
}

/* Multi-Selector, Search: 'input[type="submit"]' */

button:active, button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #333333;
	border: 2px solid #4a4a4a;
	padding: 15px 20px;
	width: 100%;
	-webkit-appearance: none; /* Removes ios styling */
	border-radius: 0; /* Removes ios styling */
	font-size: inherit;
	height: 58px;
}

textarea {
	display: block;
	height: 100%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #000;
}

select {
	border: 2px solid #ccc;
}

textarea {
	width: 100%;
}

/**
 * Styles for password protect form label (form that displays
 * when post is password protected)
 */
.cp-password-protect-label {
	font-style: italic;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 6px;
	display: block;
	transform: rotate(-1deg);
}

form.search-form {
	overflow: hidden;
	position: relative;
	z-index: 1;
}

form.search-form .search-field {
	width: 90%;
	float: left;
}

form.search-form .search-submit {
	width: 10%;
	height: 58px;
	border-top: 2px solid;
	border-right: 2px solid;
	border-bottom: 2px solid;
	background-position: center 6px;
	background-image: url(assets/img/cp-main-icon-sprite.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/cp-main-icon-sprite.svg);
	background-repeat: no-repeat;
	background-color: #404040;
	box-shadow: inset 0 0 0 10px #ffffff;
	float: left;
	text-indent: -9999px;
	padding: 0;
}

form.search-form .search-submit:hover,
form.search-form .search-submit:active,
form.search-form .search-submit:focus {
	background-color: midnightblue;
}

/*--------------------------------------------------------------
3.5.1 Uniform (see: github.com/AudithSoftworks/Uniform)
--------------------------------------------------------------*/
div.checker input,div.radio input,div.selector select,div.uploader input {
	opacity: 0;
	filter: alpha(opacity=0);
	border: none;
}

div.button,div.button span,div.checker span,div.radio span,div.selector,div.selector span,div.uploader,div.uploader span.action {
	background: url(assets/img/forms/uniform/sprite.png) no-repeat;
	-webkit-font-smoothing: antialiased;
}

div.button,div.checker,div.radio,div.selector,div.uploader {
	display: -moz-inline-box;
	display: inline-block;
	zoom: 1;
	vertical-align: middle;
}

div.button:focus,div.checker:focus,div.radio:focus,div.selector:focus,div.uploader:focus {
	outline: 0;
}

div.button,div.button *,div.checker,div.checker *,div.radio,div.radio *,div.selector,div.selector *,div.uploader,div.uploader * {
	margin: 0;
	padding: 0;
}

.highContrastDetect {
	background: url(assets/img/forms/uniform/bg-input.png) repeat-x;
	width: 0;
	height: 0;
}

div.selector,div.selector span {
	overflow: hidden;
	height: 62px;
	padding-top: 12px;
	padding-right: 40px;
}

input.uniform-input,select.uniform-multiselect,textarea.uniform {
	padding: 3px;
	background: url(assets/img/forms/uniform/bg-input.png) repeat-x;
	outline: 0;
}

input.uniform-input.active,select.uniform-multiselect.active,textarea.uniform.active {
	background: url(assets/img/forms/uniform/bg-input-focus.png) repeat-x;
}

div.checker input,input[type=search],input[type=search]:active {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

div.selector {
	background-position: 0 -322px;
	padding: 0 0 0 10px;
	position: relative;
	width: 100% !important;
	margin-top: -2px;
	max-width: 500px;
}

div.selector span {
	text-overflow: ellipsis;
	display: block;
	white-space: nowrap;
	background-position: right 0;
	cursor: pointer;
	width: 100% !important;
	padding-left: 10px;
}

div.selector.fixedWidth {
	width: 190px;
}

div.selector.fixedWidth span {
	width: 155px;
}

div.selector select {
	background: 0 0;
	position: absolute;
	height: 58px;
	top: 2px;
	left: 0;
	width: 100%;
}

div.checker,div.radio,div.uploader {
	position: relative
}

div.selector.active, div.selector.focus {
	background-position: 0 -386px;
}

div.selector.active span, div.selector.focus span {
	background-position: right -64px;
}

div.selector.hover {
	background-position: 0 -452px;
}

div.selector.hover span {
	background-position: right -130px;
}

div.selector.focus.active,
div.selector.hover.active,
div.selector.hover.focus {
	background-position: 0 -518px;
}

div.selector.focus.active span,
div.selector.hover.active span,
div.selector.hover.focus span {
	background-position: right -196px;
}

div.selector.disabled,div.selector.disabled.active {
	background-position: 0 -294px;
}

div.selector.disabled span,div.selector.disabled.active span {
	background-position: right -164px;
}

div.checker,div.checker input,div.checker span {
	width: 19px;
	height: 19px;
}

div.checker span {
	display: -moz-inline-box;
	display: inline-block;
	zoom: 1;
	text-align: center;
	background-position: 0 -645px;
}

div.checker span.checked {
	background-position: -76px -645px;
}

div.checker input {
	background: 0 0;
	display: -moz-inline-box;
	display: inline-block;
	zoom: 1;
}

div.checker.active span {
	background-position: -19px -645px;
}

div.checker.active span.checked {
	background-position: -95px -320px;
}

div.checker.hover span {
	background-position: -38px -645px;
}

div.checker.focus span {
	background-position: -19px -645px;
}

div.checker.hover span.checked {
	background-position: -114px -645px;
}

div.checker.focus.active span,div.checker.hover.active span {
	background-position: -57px -645px;
}

div.checker.focus.active span.checked,
div.checker.hover.active span.checked,
div.checker.focus span.checked {
	background-position: -133px -645px;
}

div.checker.disabled span,div.checker.disabled.active span {
	background-position: -152px -320px;
}

div.checker.disabled span.checked,div.checker.disabled.active span.checked {
	background-position: -171px -320px;
}

div.radio,div.radio input,div.radio span {
	width: 18px;
	height: 18px;
}

div.uploader,div.uploader span.action {
	height: 28px;
	cursor: pointer;
	overflow: hidden;
}

div.radio span {
	display: -moz-inline-box;
	display: inline-block;
	zoom: 1;
	text-align: center;
	background-position: 0 -664px;
}

div.radio span.checked {
	background-position: -72px -664px;
}

div.radio input {
	background: 0 0;
	display: -moz-inline-box;
	display: inline-block;
	zoom: 1;
	text-align: center;
}

div.radio.active span {
	background-position: -18px -339px
}

div.radio.active span.checked,
div.radio.focus span.checked {
	background-position: -90px -664px;
}

div.radio.focus span,div.radio.hover span {
	background-position: -36px -664px;
}

div.radio.hover span.checked {
	background-position: -108px -664px;
}

div.radio.focus.active span,div.radio.hover.active span {
	background-position: -54px -664px;
}

div.radio.focus.active span.checked,div.radio.hover.active span.checked {
	background-position: -126px -664px;
}

div.radio.disabled span,div.radio.disabled.active span {
	background-position: -144px -339px;
}

div.radio.disabled span.checked,div.radio.disabled.active span.checked {
	background-position: -162px -339px;
}

div.uploader {
	background-position: 0 -297px;
	width: 190px;
}

div.uploader span.action {
	background-position: right -409px;
	line-height: 28px;
	width: 82px;
	text-align: center;
	float: left;
	display: inline;
}

div.uploader span.filename {
	text-overflow: ellipsis;
	display: block;
	overflow: hidden;
	white-space: nowrap;
	float: left;
	cursor: default;
	height: 24px;
	margin: 2px 0 2px 2px;
	line-height: 24px;
	width: 85px;
	padding: 0 10px;
}

div.uploader input {
	background: 0 0;
	position: absolute;
	top: 0;
	right: 0;
	float: right;
	cursor: default;
	width: 100%;
	height: 100%;
}

div.uploader.active span.action {
	background-position: right -465px;
}

div.uploader.focus,div.uploader.hover {
	background-position: 0 -353px;
}

div.uploader.focus span.action,div.uploader.hover span.action {
	background-position: right -437px;
}

div.uploader.focus.active span.action,div.uploader.hover.active span.action {
	background-position: right -493px;
}

div.uploader.disabled,div.uploader.disabled.active {
	background-position: 0 -325px;
}

div.uploader.disabled span.action,div.uploader.disabled.active span.action {
	background-position: right -381px;
}

div.button {
	background-position: 0 -641px;
	height: 30px;
	cursor: pointer;
	position: relative;
}

div.button a,div.button button,div.button input {
	opacity: .01;
	filter: alpha(opacity=1);
	display: block;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	position: absolute;
}

div.button span {
	display: -moz-inline-box;
	display: inline-block;
	zoom:1;line-height: 22px;
	text-align: center;
	background-position: right -521px;
	height: 22px;
	margin-left: 13px;
	padding: 8px 15px 0 2px;
}

div.button.active {
	background-position: 0 -671px;
}

div.button.active span {
	background-position: right -551px;
	cursor: default;
}

div.button.focus,div.button.hover {
	background-position: 0 -701px;
}

div.button.focus span,div.button.hover span {
	background-position: right -581px;
}

div.button.disabled,div.button.disabled.active {
	background-position: 0 -731px;
}

input.uniform-input,select.uniform-multiselect,textarea.uniform {
	font-weight: 400;
	color: #777;
	border: 1px solid #aaa;
	border-right-color: #ccc;
	border-bottom-color: #ccc;
	border-radius: 3px;
}

input.uniform-input.focus,input.uniform-input.hover,select.uniform-multiselect.focus,select.uniform-multiselect.hover,textarea.uniform.focus,textarea.uniform.hover {
	box-shadow: 0 0 4px rgba(0,0,0,.3);
	border-color: #999;
}

div.button span {
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

div.button.focus span,div.button.hover span {
	color: #555;
}

div.button.disabled span,div.button.disabled.active span {
	background-position: right -611px;
	cursor: default;
	color: #bbb;
}

div.selector span {
	color: #666;
	text-shadow: 0 1px 0 #fff;
}

div.selector.disabled span,div.selector.disabled.active span {
	color: #bbb;
}

div.checker {
	margin-right: 5px;
}

div.radio {
	margin-right: 3px;
}

div.uploader span.action {
	text-shadow: #fff 0 1px 0;
	background-color: #fff;
	font-size: 11px;
	font-weight: 700;
}

div.uploader span.filename {
	color: #777;
	border-right: solid 1px #bbb;
	font-size: 11px;
}

div.uploader.disabled span.action,div.uploader.disabled.active span.action {
	color: #aaa;
}

div.uploader.disabled span.filename,div.uploader.disabled.active span.filename {
	border-color: #ddd;
	color: #aaa;
}

input.uniform-input,input.uniform-input:focus {
	background-color: #fff;
}

/*--------------------------------------------------------------
3.6 Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.6.1 Links
--------------------------------------------------------------*/
a {
	color: royalblue;
	text-decoration: none;
}

a:hover, a:focus, a:active {
	color: midnightblue;
}

a:focus {
	outline: thin dotted;
}

a:hover, a:active {
	outline: 0;
}

.entry-footer a {
	padding: 8px 12px;
    margin: 2px;
    position: relative;
    font-size: .85em;
}

/* Multi-Selector, Search: '.entry-footer a' */

.entry-footer a:before {
	content: '';
	position: absolute;
	width: 3px;
	height: 100%;
	background-color: #fff;
	top: 0;
	left: -1px;
	transform: rotate(2deg);
}

/* sits just after the post on archive pages to allow visitor to click to view the post */
.a--cp-btn--archive-link {
	position: absolute;
	margin: 0;
	left: 0;
	right: 0;
	width: 260px;
	z-index: 99;
	left: 0;
	right: 0;
	margin: -85px auto 0;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
}

a.post-edit-link {
	position: absolute;
	right: 0;
	margin-top: -30px;
	border-radius: 5px;
	box-shadow: 0 0 10px 0 #ccc;
	border: 2px solid #fff;
	transform: rotate(-2deg);
	overflow: hidden;
}

a.post-edit-link:before {
	content: none;
}

/*--------------------------------------------------------------
3.6.2 Menus
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.6.2.1 Header
--------------------------------------------------------------*/
.main-navigation {
	margin-bottom: 0;
}
/* Multi-Selector, Search: '.main-navigation' */

.main-navigation a:hover,
.main-navigation a:active,
.main-navigation a:focus {
	color: midnightblue;
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
	line-height: normal;
}

/* 'main-navigation--caps' is added if 'nav-caps' is true (in header options) */
.main-navigation.main-navigation--caps ul {
	text-transform: uppercase;
}

.main-navigation ul ul ul {
	left: -999em;
}

.main-navigation ul ul a {
	padding-left: 20px;
	padding-right: 20px;
	display: block;
}

.main-navigation a {
	color: inherit;
	font-weight: 700;
	padding: 7px 0;
	display: block; /* Needed for SmartMenus */
}

#primary-menu li,
#primary-menu a {
	position: relative;
}

/* top level menu items on header menu */
#primary-menu > li {
	font-size: .8em;
	line-height: normal;
}

#primary-menu .menu-item-has-children > a {
	padding-right: 15px;
	position: relative;
	width: 100%;
	display: block;
}

#primary-menu .sub-menu .menu-item-has-children > a {
	padding-right: 32px;
}

#primary-menu .menu-item-has-children > a:before,
#primary-menu .menu-item-has-children > a:after {
	content: "";
	position: absolute;
	right: 0;
	height: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	border-top: 6px solid #404040;
	border-right: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 6px solid transparent;
	right: -2px;
	top: 4px;
}

#primary-menu .menu-item-has-children > a:hover:before,
#primary-menu .menu-item-has-children > a:active:before,
#primary-menu .menu-item-has-children > a:focus:before {
	border-top-color: midnightblue;
}
	
#primary-menu .menu-item-has-children > a:after {
	border-top: 6px solid #ffffff;
	top: 0;
}

#primary-menu .menu-item-has-children > a.highlighted:before,
#primary-menu .menu-item-has-children > a.highlighted:after {
	border-top-color: transparent;
	border-bottom-color: #404040;
	top: -8px;
}

#primary-menu .menu-item-has-children > a.highlighted:hover:before,
#primary-menu .menu-item-has-children > a.highlighted:active:before,
#primary-menu .menu-item-has-children > a.highlighted:focus:before {
	border-bottom-color: midnightblue;
}
	
#primary-menu .menu-item-has-children > a.highlighted:after {
	border-bottom-color: #ffffff;
	top: -4px;
}

#primary-menu .sub-menu .menu-item-has-children > a:before,
#primary-menu .sub-menu .menu-item-has-children > a:after {
	right: 15px;
}

.menu-item-split-wrapper {
	font-style: italic;
}

/* top level menu items floated right */
#primary-menu > li:first-child {
	margin-left: 0;
}

#primary-menu > .current-menu-item > a {
	padding-left: 15px;
}

.current-menu-item:before {
	content: '';
	position: absolute;
	height: 8px;
    width: 5px;
	background-color: #c5c5c5;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

.sub-menu .current-menu-item:before {
	left: 6px;
}

/**
 * The class can be added to a sub-menu li and will display
 * as a heading/divider, great for adding some
 * separation between sub-menu items.
 * (declarations in responsive section below)
 */
 #primary-menu .cp-menu-heading {
	display: none;
}

/* small menu */
#cp-menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

.cp-menu-toggle {
	position: absolute;
	right: 6.5%;
	height: 29px;
	width: 29px;
	text-indent: -9999px;
	padding: 0;
	top: 15px;
	margin: auto;
	cursor: pointer;
	z-index: 9999;
}

.cp-menu-toggle:before {
	content: '';
	position: absolute;
	width: 1px;
	height: 140%;
	background-color: #ccc;
	top: -20%;
	left: -20px;
	transform: rotate(2deg);
}

/* hamburger icon */
.cp-menu-toggle-icon,
.cp-menu-toggle-icon:before,
.cp-menu-toggle-icon:after {
	position: absolute;
	margin: auto;
	top: 14px;
	right: 0;
	left: 0;
	height: 2px;
	width: 17px;
	background: #000000;
	-webkit-transition: all 0.25s;
	transition: all 0.25s;
}

.cp-menu-toggle-icon:before {
	content: '';
	top: -5px;
	left: 0;
}

.cp-menu-toggle-icon:after {
	content: '';
	top: 5px;
	left: 0;
}

#cp-menu-toggle:hover + .cp-menu-toggle .cp-menu-toggle-icon,
#cp-menu-toggle:active + .cp-menu-toggle .cp-menu-toggle-icon,
#cp-menu-toggle:focus + .cp-menu-toggle .cp-menu-toggle-icon,
#cp-menu-toggle:hover + .cp-menu-toggle .cp-menu-toggle-icon:before,
#cp-menu-toggle:active + .cp-menu-toggle .cp-menu-toggle-icon:before,
#cp-menu-toggle:focus + .cp-menu-toggle .cp-menu-toggle-icon:before,
#cp-menu-toggle:hover + .cp-menu-toggle .cp-menu-toggle-icon:after,
#cp-menu-toggle:active + .cp-menu-toggle .cp-menu-toggle-icon:after,
#cp-menu-toggle:focus + .cp-menu-toggle .cp-menu-toggle-icon:after {
	background: #ffffff;
}

/* x icon */
#cp-menu-toggle:checked ~ .cp-menu-toggle .cp-menu-toggle-icon {
	height: 0;
	background: transparent;
}

#cp-menu-toggle:checked ~ .cp-menu-toggle .cp-menu-toggle-icon:before {
	top: 0;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

#cp-menu-toggle:checked ~ .cp-menu-toggle .cp-menu-toggle-icon:after {
	top: 0;
	-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
}

/* hide menu state checkbox (keep it visible to screen readers) */
#cp-menu-toggle {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	border: 0;
	padding: 0;
	overflow: hidden;
	clip: rect(1px,1px,1px,1px);
}

/* hide the menu in mobile view */
#cp-menu-toggle:not(:checked) ~ .main-menu-container {
	display: none;
}

#cp-menu-toggle:checked ~ #main-menu {
	display: block;
}

@media (min-width:600px) {
	.cp-menu-toggle {
		right: 10%;
	}
}

@media (min-width: 768px) {
	/* hide the button in desktop view */
	.cp-menu-toggle {
		top: -99999px;
	}

	/* always show the menu in desktop view */
	#cp-menu-toggle:not(:checked) ~ .main-menu-container {
		display: table-cell; /* using table-cell as vertically aligned */
		vertical-align: middle;
		width: 100%;
	}

	#primary-menu > .current-menu-item:before {
		content: '';
		position: absolute;
		height: 1px;
		width: 100%;
		top: auto;
		bottom: 3px;
	}

	#primary-menu > .current-menu-item > a {
		padding-left: 0;
	}

	.sub-menu .current-menu-item:before {
		left: -1px;
	}

	#primary-menu .cp-menu-heading {
		overflow: hidden;
		display: block;
		margin-bottom: -4px;
	}

	#primary-menu li + .cp-menu-heading {
		margin-top: 5px;
	}
	
	.cp-menu-heading:before {
		content: '';
		width: 100%;
		position: absolute;
		height: 1px;
		background-color: #eeeeee;
		bottom: 0;
		top: 0;
		margin: auto;
		right: 20px;
	}
	
	#primary-menu .cp-menu-heading a {
		font-weight: normal;
		font-size: .8em;
		color: #7b7b7b;
		display: inline-block;
		font-style: italic;
		padding-right: 12px;
		background-color: #fff;
	}
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 75%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 75%;
}

/*--------------------------------------------------------------
3.6.2.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.comment-navigation .nav-previous,
	.posts-navigation .nav-previous,
	.post-navigation .nav-previous,
	.comment-navigation .nav-next,
	.posts-navigation .nav-next,
	.post-navigation .nav-next {
		width: 48%;
	}
}

@media screen and (max-width: 767px) {
	.sub-menu .sub-menu,
	.sm[data-smartmenus-id] .sub-menu .sub-menu	{
		margin-left: 20px;
	}

	#primary-menu a {
		border-top: 1px solid #ccc;
		padding-top: 15px;
		padding-bottom: 15px;
		display: block;
	}
}

@media (min-width: 768px) {
	.main-navigation {
		position: relative;
		clear: both;
		display: table; /* using table as children are vertically aligned */
	}

	#cp-menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: block;
	}

	#primary-menu .menu-item-split-wrapper > a {
		padding-right: 16px;
	}

	.main-navigation ul ul {
		position: absolute;
		left: -999em;
		z-index: 99999;
		margin-top: 5px;
		padding: 20px 0;
		background: #fff;
		opacity: 0;
		box-shadow: 0 0 100px rgba(50,50,93,.1), 0 0 35px rgba(50,50,93,.15), 0 0 15px rgba(0,0,0,.1);
		-webkit-transform-origin: 50% -7px;
				transform-origin: 50% -7px;
		-webkit-transform: scale(0);
				transform: scale(0);
		-webkit-transition: -webkit-transform .35s cubic-bezier(.4,1.5,.5,1), opacity .25s linear;
				transition: transform .35s cubic-bezier(.4,1.5,.5,1), opacity .25s linear;
	}

	.main-navigation ul li:hover > ul,
	/* legacy */
	.main-navigation ul li.focus > ul,
	/* smart menu */
	.main-navigation .highlighted + ul {
		position: absolute;
		left: auto;
		opacity: 1;
		max-width: none !important; /* Added as issue with smart menus deciding to set its own max width */
		-webkit-transform: scale(1);
				transform: scale(1);
		-webkit-transform-origin: 0;
				transform-origin: 0;
	}

	#primary-menu ul ul,
	#primary-menu ul ul {
		left: 150px !important;
		margin-left: 0 !important;
	}

	.main-navigation ul ul:before {
		content: '';
		position: absolute;
		width: 0;
		height: 0;
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
		border-bottom: 6px solid #ffffff;
		top: -6px;
		right: 0;
		left: 0;
		margin: auto;
	}

	.main-navigation ul ul ul:before {
		border-left: 5px solid transparent;
		border-right: 6px solid #ffffff;
		border-top: 5px solid transparent;
		border-bottom: 5px solid transparent;
		top: 13px;
		right: auto;
		left: -11px;
	}

	#primary-menu {
		text-align: right;
	}

	#primary-menu ul {
		text-align: left;
		width: 150px !important;
		left: 50% !important;
		margin-left: -75px !important;
	}

	#primary-menu > li {
		margin: 0 0 0 12px;
		display: inline-block;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1119px) {
	.main-navigation {
		margin-right: 0;
		width: 82%;
		margin-left: 9%;
	}

	#primary-menu {
		padding: 15px 0 15px 161px;
		font-size: .9em;
		line-height: 1.4em;
		position: relative;
	}
}

@media (min-width: 1120px) {
	.main-navigation {
		width: 62.5%;
	}

	.site-header__main--no-cta .main-menu-container > ul {
		margin-right: -75px;
	}

	#primary-menu,
	.site-header__cta {
		padding: 15px 0;
	}

	.site-header__cta__btn {
		margin-right: -75px;
	}

	#primary-menu > li {
		margin-left: 19px;
	}
}

/*--------------------------------------------------------------
##### Smart Menu Styles - https://www.smartmenus.org
--------------------------------------------------------------*/
.sm[data-smartmenus-id] {
	position:relative;
	z-index:9999;
}

.sm[data-smartmenus-id],
.sm[data-smartmenus-id] ul,
.sm[data-smartmenus-id] li {
	display:block;
	list-style:none;
	margin: 0;
	direction: ltr;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.sm-rtl[data-smartmenus-id],
.sm-rtl[data-smartmenus-id] ul,
.sm-rtl[data-smartmenus-id] li {
	direction: rtl;
	text-align: right;
}

.sm[data-smartmenus-id] > li > h1,
.sm[data-smartmenus-id] > li > h2,
.sm[data-smartmenus-id] > li > h3,
.sm[data-smartmenus-id] > li > h4,
.sm[data-smartmenus-id] > li > h5,
.sm[data-smartmenus-id] > li > h6 {
	margin:0;
	padding:0;
}

.sm[data-smartmenus-id] ul {
	display:none;
}

.sm[data-smartmenus-id] a.disabled {
	cursor:not-allowed;
}

.sm[data-smartmenus-id]:after {
	content: "\00a0";
	display: block;
	height: 0;
	font: 0px/0 serif;
	clear: both;
	visibility: hidden;
	overflow: hidden;
}

.sm[data-smartmenus-id],
.sm[data-smartmenus-id] *,
.sm[data-smartmenus-id] *:before,
.sm[data-smartmenus-id] *:after {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
}

span.sub-arrow {
	position: absolute;
	height: 12px;
	width: 12px;
	bottom: 0;
	margin: auto;
	z-index: 99;
	right: -1px;
	top: 5px;
}

.sub-menu span.sub-arrow {
	width: 33px;
	height: 20px;
}

/*--------------------------------------------------------------
3.6.2.2.1.1 Responsive
--------------------------------------------------------------*/
@media screen and (min-width: 768px) {
	.sub-menu .sub-menu[aria-expanded="true"] {
		left: 100%;
		margin-top: -30px;
	}
}

/*--------------------------------------------------------------
3.6.3 Pagination
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.6.3.1 Blocks
--------------------------------------------------------------*/
.blog.hfeed .nav-links,
.archive .nav-links {
	overflow: hidden;
}

/* Multi-Selector, Search: '.nav-links' */

/*--------------------------------------------------------------
3.6.3.2 Elements
--------------------------------------------------------------*/
span.page-numbers.current {
	float: left;
	padding: 20px 0;
	width: 15%;
	font-size: .8em;
	margin: 0 .5% 30px 0;
	background: #f3f3f3;
	text-align: center;
	border: 2px dashed #f3f3f3;
}

.navigation.pagination .nav-links span.dots {
	padding: 12px 0;
	float: left;
	width: 4%;
}

/*--------------------------------------------------------------
3.6.3.3 Links
--------------------------------------------------------------*/
.nav-links a,
.pagination a {
	float: left;
	padding: 20px;
	width: 100%;
	border: 2px dashed #eee;
	margin-bottom: -2px;
	font-size: .8em;
	position: relative;
	font-weight: 700;
}

.navigation.pagination .nav-links a,
.navigation.pagination .nav-links span.dots {
	padding: 20px 0;
	width: 7.5%;
	text-align: center;
	margin-right: .5%;
}

.navigation.pagination .next.page-numbers,
.navigation.pagination .prev.page-numbers {
	width: 21.2%;
}

.nav-previous a,
.nav-next a {
	box-shadow: none;
	background: none;
	padding-left: 45px;
}

.nav-next a {
	padding-right: 45px;
	padding-left: 20px;
}

.nav-previous a:before,
.nav-next a:before {
	background-position: center -49px;
	background-color: royalblue;
	width: 16px;
	height: 24px;
	left: 15px;
}

.nav-next a:before {
	background-position: center -85px;
	left: auto;
	right: 15px;
}

/* Multi-Selector, Search: '.nav-previous a:before' */
/* Multi-Selector, Search: '.nav-next a:before' */

.nav-previous a:hover:before,
.nav-previous a:active:before,
.nav-previous a:focus:before,
.nav-next a:hover:before,
.nav-next a:active:before,
.nav-next a:focus:before {
	background-color: midnightblue;
}

/*--------------------------------------------------------------
3.6.4 Breadcrumb
--------------------------------------------------------------*/
/**
 * styles for the yoast breadcrumb - if yoast seo is installed,
 * breadcrumb will display just above the footer. Function
 * that calls the breadcrumb is in footer.php
 */
.cp-breadcrumb {
	padding: 1em 6.5%;
	font-size: .85em;
	margin: 0;
	border-top: 1px solid #ccc;
	text-transform: uppercase;
}

/*--------------------------------------------------------------
3.6.4.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-breadcrumb {
		padding: 1em 10%;
		margin: 0;
	}
}

@media (min-width: 768px) {
	.cp-breadcrumb {
		padding: 1em 18%;
		margin: 0;
	}
}

@media (min-width: 1120px) {
	.cp-breadcrumb {
		padding: 1em 25%;
		margin: 0;
	}
}

/*--------------------------------------------------------------
3.7 Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
3.8 Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
3.9 Clearings
See: https://css-tricks.com/snippets/css/clear-fix/
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after,
.cp-donations--quick:before,
.cp-donations--quick:after,
.ul--cp-show-posts:before,
.ul--cp-show-posts:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after,
.cp-donations--quick:after,
.ul--cp-show-posts:after {
	clear: both;
}

/*--------------------------------------------------------------
3.10 Widgets
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.10.1 Typography
--------------------------------------------------------------*/
#content .widget-title,
#content .widgettitle,
#content .calendar_wrap caption {
	font-size: 1.4em;
	margin: 0;
	padding: 8px 10px 8px 0;
	display: inline-block;
	position: relative;
	transform: rotate(-1deg);
}

/* heading for calendar widget */
#content .calendar_wrap caption {
	display: table-caption;
	text-align: left;
	font-size: 1em;
	font-style: normal;
}

/*--------------------------------------------------------------
3.10.2 Blocks
--------------------------------------------------------------*/
#content .widget * {
	margin: 0;
}

.widget-area {
	margin: 0;
	border-top: 2px dashed #eee;
	background: #fbfbfb;
}

.widget-area:after {
	content: "";
	display: block;
	position: absolute;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	background: linear-gradient(180deg,hsla(0,0%,100%,0),#fff 90%);
	bottom: 0;
	right: 0;
	left: auto;
	width: 100%;
	height: 235px;
	z-index: 1;
}

/* Multi-Selector, Search: '.widget-area__container' */

.widget {
	font-size: .8em;
	padding: 20px 0;
	border-top: 2px dashed #eee;
}

/* Multi-Selector, Search: '.widget' */

.widget:first-child {
	 border-top: 0;
}

/* Calendar widget */
.calendar_wrap {
	font-style: italic;
}

/*--------------------------------------------------------------
3.10.3 Elements
--------------------------------------------------------------*/
#content .widget ul {
	list-style: none;
	padding-left: 20px;
	position: relative;
}

#content .widget ul:before {
	content: '';
	display: block;
	position: absolute;
	width: 4px;
	top: 15px;
	bottom: 10px;
	left: 0;
	background: #eee;
}

#content .widget ul#recentcomments {
	padding: 10px 20px;
}

.comment-author-link {
	position: relative;
	color: #808080;
}

/* Calendar widget table */
table#wp-calendar {
	margin: 0;
	width: 100%;
}

tfoot td#prev {
	text-align: left;
}

tfoot td#next {
	text-align: right;
	padding-right: 0;
}

/*--------------------------------------------------------------
3.10.4 Forms
--------------------------------------------------------------*/
#content .widget form {
	margin: 0;
}

.widget select {
	max-width: 100%;
}

/*--------------------------------------------------------------
3.10.5 Links
--------------------------------------------------------------*/
.widget ul a {
	margin: 4px 20px;
	display: inline-block;
	color: #656565;
	border-radius: 1em 0 1em 0;
	/* background-image: linear-gradient(-100deg, rgba(250,247,133,0.3), rgba(250,247,133,0.7) 95%, rgba(250,247,133,0.1)); */
	font-weight: 700;
	font-style: italic;
}

table#wp-calendar a {
	color: #656565;
	background-image: linear-gradient(-100deg, rgba(250,247,133,0.3), rgba(250,247,133,0.7) 95%, rgba(250,247,133,0.1));
	font-weight: 700;
}

/*--------------------------------------------------------------
3.11 Posts
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.11.1 Typography
--------------------------------------------------------------*/
.entry-meta__bio {
	color: #7b7b7b;
	line-height: 1.6em;
	font-style: italic;
}

/*--------------------------------------------------------------
3.11.2 Blocks
--------------------------------------------------------------*/
.entry-meta,
.cat-links /* post categories (bottom of post) - acts as a block, but 'tis a span */,
.tags-links,
.comments-link {
	position: relative;
	font-size: .8em;
	display: block;
}

.entry-meta {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 20px 0;
}

.entry-meta__avatar-wrapper {
	position: absolute;
	top: 0;
	bottom: 0;
	height: 62px;
	margin: auto;
}

.entry-meta__text-wrapper {
	display: inline-block;
	vertical-align: middle;
	padding: 5px 0 5px 78px;
}

.entry-meta__text-wrapper * {
	display: block; /* quite a few spans end up in here, this makes sure they are all blocks */
}

.entry-meta__social-media {
	line-height: 1em;
	margin: 0 0 4px 0;
}

/*--------------------------------------------------------------
3.11.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.entry-meta__avatar-wrapper {
		height: 96px;
	}

	.entry-meta__text-wrapper {
		padding: 10px 0 10px 115px;
	}
}

/*--------------------------------------------------------------
3.11.3 Links
--------------------------------------------------------------*/
.entry-meta .author .url {
	font-size: 1.2em;
	font-weight: 700;
	color: #404040;
}

.entry-meta__social-media a {
	font-size: .8em;
	color: #7b7b7b;
}

.entry-meta__published-date,
.entry-meta__reading-time {
	color: #404040;
	display: inline-block;
	line-height: 1em;
}

.entry-meta__reading-time {
	margin-left: 5px;
}

.entry-meta__reading-time:before {
	content: "";
	margin: 0 2px 4px 2px;
	display: inline-block;
	height: 4px;
	width: 4px;
	background-color: #b6b6b6;
	border-radius: 100%;
}

/*--------------------------------------------------------------
3.11.4 Media
--------------------------------------------------------------*/
.entry-meta__avatar {
	border-radius: 999px;
	width: 62px;
}

/*--------------------------------------------------------------
3.11.4.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.entry-meta__avatar {
		width: 96px;
	}
}

/*--------------------------------------------------------------
3.12 Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.1 Posts and pages
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.1.1 Blocks
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.hentry {
	margin: 0 0 1.5em;
}

.blog.hfeed .hentry,
.archive .hentry {
	margin: 0 6.5% 50px;
	font-size: .85em;
	position: relative;
	max-height: 1000px;
	overflow: hidden;
	z-index: 1;
	padding: 2%;
}

.blog.hfeed .hentry:first-child,
.archive .hentry:first-child,
.blog.hfeed header + .hentry /* For when blog page is not the homepage (as the page title is hidden by screen reader text) */ {
	margin-top: 50px
}

.blog.hfeed .hentry:before,
.archive .hentry:before {
	border: 10px solid #eeeeee;
	box-shadow: none;
}

/* Multi-Selector, Search: '.blog.hfeed .hentry:before' */
/* Multi-Selector, Search: '.archive .hentry:before' */

.blog.hfeed .hentry:after,
.archive .hentry:after {
	content: "";
	display: block;
	position: absolute;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	background: linear-gradient(180deg,hsla(0,0%,100%,0),#fff 90%);
	bottom: 0;
	right: 0;
	left: auto;
	width: 100%;
	height: 50%;
	z-index: 105;
}

/* sticky post */
.blog.hfeed .hentry.sticky,
.archive .hentry.sticky {
	border: 3px solid #ffa500;
}

.updated:not(.published) {
	display: none;
}

/*--------------------------------------------------------------
3.12.1.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.blog.hfeed .hentry,
	.archive .hentry {
		margin: 0 10% 50px;
	}
}

@media (min-width: 768px) {
	.blog.hfeed .hentry,
	.archive .hentry {
		margin: 0 18% 50px;
	}
}

@media (min-width: 1120px) {
	.blog.hfeed .hentry,
	.archive .hentry {
		margin: 0 25% 50px;
	}

	/* Multi-Selector, Search: '.hfeed .hentry' */
}

/*--------------------------------------------------------------
3.12.1.2 Links
--------------------------------------------------------------*/
.page-links {
	font-size: .85em;
	clear: both;
	margin-bottom: 1.5em;
}

.page-links a {
	width: 21.2%;
	box-shadow: 2px 3px 7px 0 #dadada;
	padding: 20px;
}

/*--------------------------------------------------------------
3.12.1.3 Forms
--------------------------------------------------------------*/
/**
 * Form that displays a select to allow user to choose blog category.
 * Displays on main post archive and category archive.
 */
form#cp-category-filter {
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	text-align: center;
	font-size: .8em;
	font-style: italic;
    z-index: 1;
    position: relative;
    padding: 20px;
    overflow: hidden;
}

.cp-category-filter__select {
	display: inline-block;
}

/* Additional padding to select as font-size .2em smaller */
div.cp-category-filter__select span {
	padding-top: 20px;
}

/*--------------------------------------------------------------
3.12.1.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	div.cp-category-filter__select span {
		padding-top: 17px;
	}
}

/*--------------------------------------------------------------
3.12.2 Attachment Pages
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.2.1 Typography
--------------------------------------------------------------*/
.attachment .entry-title {
	transform: rotate(-1deg);
}

/*--------------------------------------------------------------
3.12.2.2 Elements
--------------------------------------------------------------*/
.attachment .entry-title > span {
	border-radius: 1em 0 1em 0;
	background-image: linear-gradient(-100deg, rgba(250,247,133,0.3), rgba(250,247,133,0.7) 95%, rgba(250,247,133,0.1));
}

/*--------------------------------------------------------------
3.12.2.3 Media
--------------------------------------------------------------*/
.cp-attachment-img {
	transform: rotate(-1.5deg);
}

/*--------------------------------------------------------------
3.12.3 Search results page
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.3.1 Typography
--------------------------------------------------------------*/
/* search query */
.search-results h1.page-title > span {
	border-radius: 5px 0 20px 0;
	background-image: linear-gradient(-100deg, rgba(250,247,133,0.3), rgba(250,247,133,0.7) 95%, rgba(250,247,133,0.1));
}

.search-results #content .entry-title {
	margin-top: 0;
	margin-bottom: 0;
}

#content .p--search-url {
	color: #757575;
	margin-bottom: 1em;
	font-size: .8em;
}

#content .p--search-breadcrumb {
	margin-bottom: 0;
	font-size: .8em;
}

.entry-summary {
	font-weight: 700;
}

/*--------------------------------------------------------------
3.12.3.2 Blocks
--------------------------------------------------------------*/
.search-results #content {
	background: #eeeeee;
}

.search-results article {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.search-results article:before {
	content: '';
	position: absolute;
	width: 95%;
	height: 100%;
	background: #ffffff;
	z-index: -1;
	left: 0;
	right: 0;
	margin: auto;
	transform: rotate(-1deg);
}

/*--------------------------------------------------------------
3.12.3.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.search-results article:before {
		width: 85%;
	}
}

@media (min-width: 768px) {
	.search-results article:before {
		width: 70%;
	}
}

@media (min-width: 1120px) {
	.search-results article:before {
		width: 65%;
	}
}

/*--------------------------------------------------------------
3.12.4 404 and 'Nothing Found' pages
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.4.1 Typography
--------------------------------------------------------------*/
.error404 .page-title,
.no-results .page-title {
	transform: rotate(-1deg);
}

/*--------------------------------------------------------------
3.12.4.2 Elements
--------------------------------------------------------------*/
.error404 .page-title > span,
.no-results .page-title > span {
	border-radius: 1em 0 1em 0;
	background-image: linear-gradient(-100deg, rgba(250,247,133,0.3), rgba(250,247,133,0.7) 95%, rgba(250,247,133,0.1));
}

/*--------------------------------------------------------------
3.12.4.3 Links
--------------------------------------------------------------*/
.error404 .entry-footer > a,
.no-results .entry-footer > a {
	margin-bottom: 50px;
}

/*--------------------------------------------------------------
3.12.5 Comments
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.5.1 Typography
--------------------------------------------------------------*/
.comments-title {
	font-size: 1.4em;
}

#content .comment-list .comment-reply-title,
#content .cp-accordion__panel .comment-reply-title {
	margin-left: 0;
	margin-right: 0;
	font-size: 1.4em;
}

#comments p {
	margin-top: 10px;
	margin-bottom: 10px;
}

/*--------------------------------------------------------------
3.12.5.2 Blocks
--------------------------------------------------------------*/
#comments {
	padding: 10px 0;
	font-size: .85em;
	border-top: 2px dashed #eee;
}

.comment-metadata,
div.comment-body {
	font-size: .75em;
	padding: 7px 11px;
	display: inline-block;
	border-left: 1px solid #ccc;
	font-style: italic;
}

.comment-author.vcard {
	padding: 27px 6px 0 40px;
	position: relative;
	display: inline-block;
}

.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

.comment-list .comment-respond {
	border-left: 2px dashed #eee;
	padding-left: 20px;
}

/* pingback container */
div.comment-body {
	margin-top: 20px;
}

.EmbeddedTweet {
	max-width: 100%;
}

#comments .cp-accordion__panel {
	background: none;
	padding-top: 0;
	padding-bottom: 0;
}

/*--------------------------------------------------------------
3.12.5.3 Elements
--------------------------------------------------------------*/
ol.comment-list {
	padding: 0;
	list-style: none;
}

#comments ol.children {
	margin: 0;
	padding-left: 5px;
	list-style: none;
}

#comments ol.children li {
	border-top: 2px solid #fff;
	margin-left: 20px;
}

#comments ol * {
	margin-left: 0;
	margin-right: 0;
}

#comments li.depth-1 {
	margin: 35px 0;
	border: 2px dashed #eeeeee;
	padding: 0 27px 27px;
	background-color: #ffffff;
}

span.says {
	display: none;
}

/*--------------------------------------------------------------
3.12.5.4 Links
--------------------------------------------------------------*/
#comments .comment-edit-link {
	padding: 6px 12px;
	font-size: 10px;
	margin-left: 5px;
}

/* Multi-Selector, Search: '.comment-edit-link' */

.comment-reply-link,
#cancel-comment-reply-link {
	padding: 6px 22px;
	font-size: 10px;
}

#cancel-comment-reply-link {
	background: #f00000;
	color: #ffffff;
}

/* Multi-Selector, Search: '.comment-reply-link' */
/* Multi-Selector, Search: '#cancel-comment-reply-link' */

#comments .cp-accordion__header {
	padding-top: 18px;
	padding-bottom: 18px;
}

#comments .cp-accordion__header[aria-expanded="false"]:after {
	box-shadow: none;
}

#comments .cp-accordion__header[aria-expanded=true] {
	background: none;
}

/*--------------------------------------------------------------
3.12.5.5 Forms
--------------------------------------------------------------*/
#content .cp-accordion__panel .comment-form {
	margin: 0;
}

/*--------------------------------------------------------------
3.12.5.6 Media
--------------------------------------------------------------*/
#comments .avatar {
	position: absolute;
	left: 0;
	border-radius: 999px;
}

/*--------------------------------------------------------------
3.12.6 Share links (at bottom of content)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
3.12.6.1 Typography
--------------------------------------------------------------*/
/* acts as a block */
#content .p--share-wrapper {
	margin-left: 0;
	height: 45px;
}

/* 'tis a span but acts as the heading */
.p--share-wrapper__heading {
	margin-right: 8px;
	text-transform: lowercase;
	font-size: .7em;
	font-style: italic;
	vertical-align: top;
	padding-top: 5px;
	display: inline-block;
}

/*--------------------------------------------------------------
3.12.6.2 Links
--------------------------------------------------------------*/
/* Multi-Selector, Search: '.a--entry-footer-fb' */
/* Multi-Selector, Search: '.a--entry-footer-twitter' */

/* Multi-Selector, Search: '.p--share-wrapper a:hover' */
/* Multi-Selector, Search: '.p--share-wrapper a:active' */
/* Multi-Selector, Search: '.p--share-wrapper a:focus' */

.p--share-wrapper a:before {
	content: none;
}

/*--------------------------------------------------------------
3.13 Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	/* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
3.14 Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
	width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* audio player */
.mejs-container {
	width: auto !important;
}

/* Multi-Selector, Search: '.mejs-container' */

/*--------------------------------------------------------------
3.14.1 Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

/* Multi-Selector, Search: '.wp-caption-text' */

/*--------------------------------------------------------------
3.14.2 Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

/* Multi-Selector, Search: '.gallery-columns-3' */

.gallery-item {
	display: inline-block;
	vertical-align: top;
	width: 100%;
	font-size: .6em;
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
3.14.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.gallery-columns-2 .gallery-item {
		max-width: 50%;
	}

	.gallery-columns-3 .gallery-item,
	.gallery-columns-5 .gallery-item,
	.gallery-columns-6 .gallery-item,
	.gallery-columns-7 .gallery-item,
	.gallery-columns-8 .gallery-item,
	.gallery-columns-9 .gallery-item {
		max-width: 33.33%;
	}

	.gallery-columns-4 .gallery-item {
		max-width: 25%;
	}
}

@media (min-width: 768px) {
	.gallery-columns-5 .gallery-item {
		max-width: 20%;
	}

	.gallery-columns-6 .gallery-item,
	.gallery-columns-7 .gallery-item,
	.gallery-columns-8 .gallery-item,
	.gallery-columns-9 .gallery-item {
		max-width: 16.66%;
	}
}

@media (min-width: 1120px) {
	.gallery-columns-7 .gallery-item {
		max-width: 14.28%;
	}

	.gallery-columns-8 .gallery-item {
		max-width: 12.5%;
	}

	.gallery-columns-9 .gallery-item {
		max-width: 11.11%;
	}
}

/*--------------------------------------------------------------
4 Header
--------------------------------------------------------------*/
/*--------------------------------------------------------------
4.1 Typography
--------------------------------------------------------------*/
.p--latest-content-container {
	margin: 5px 0 0;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.latest__header {
	font-size: .75em;
	font-style: italic;
	letter-spacing: .2px;
	margin-right: 2px;
}

/*--------------------------------------------------------------
4.2 Blocks
--------------------------------------------------------------*/
/* needed as search and btn in supplementary header overlap main body content and need to sit in front */
.site-header {
	position: relative;
	z-index: 997;
}

.site-header__main {
	position: relative; /* Contains absolute positioned logo. */
	border-bottom: 1px solid #ccc;
	min-height: 60px;
}

.site-branding {
	padding: 18px 0;
	margin-left: 6.5%;
	line-height: 0;
}

/* Multi-Selector, Search: '.site-header__supplementary' */

.site-header__supplementary__latest {
	display: none;
}

.site-header__supplementary__social {
	position: absolute;
	right: 6.5%;
	top: 0;
}

/* Wrapper for search (hidden until 'btn--search-js' is clicked) */
.site-header__supplementary__search-js {
	display: none;
	width: 87%;
	position: absolute;
	right: 6.5%;
	top: 0;
	padding-right: 30px;
	z-index: 2;
}

/*--------------------------------------------------------------
4.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.site-branding {
		margin-left: 10%;
	}

	.site-header__supplementary__social,
	.site-header__supplementary__search-js {
		right: 10%;
	}

	.site-header__supplementary__search-js {
		width: 80%;
	}
}

@media (min-width: 768px) {
	.site-branding {
		margin-left: 9%;
		padding: 0;
		z-index: 1;
	}

	.site-header__supplementary	{
		padding: 0 9%;
		height: 35px;
	}

	.site-header__supplementary__latest {
		display: block;
		text-transform: uppercase;
		font-size: .85em;
		font-weight: 700;
		overflow: hidden;
	}

	.site-header__supplementary--with-search .site-header__supplementary__latest {
		margin-right: 35px;
	}

	/* This class is added if there is 1 social media icon */
	.site-header__supplementary__latest--p-r-1 {
		padding-right: 65px;
	}

	/* This class is added if there are 2 social media icons */
	.site-header__supplementary__latest--p-r-2 {
		padding-right: 95px;
	}

	/* This class is added if there are 3 social media icons */
	.site-header__supplementary__latest--p-r-3 {
		padding-right: 125px;
	}

	/* This class is added if there are 4 social media icons */
	.site-header__supplementary__latest--p-r-4 {
		padding-right: 155px;
	}

	/* This class is added if there are 5 social media icons */
	.site-header__supplementary__latest--p-r-5 {
		padding-right: 185px;
	}

	.site-header__supplementary__social,
	.site-header__supplementary__search-js {
		right: 9%;
	}

	.site-header__supplementary__search-js {
		width: 35%;
	}
}

@media (min-width: 1120px) {
	.site-branding {
		margin: 0;
		padding: 0;
	}

	.site-header__supplementary {
		padding: 0 12.5%;
		overflow: hidden;
	}

	.site-header__supplementary__latest {
		margin-left: -75px;
	}

	.site-header__supplementary__social {
		right: 12.5%;
		margin-right: -75px;
	}

	.site-header__supplementary__search-js {
		right: 12.5%;
		width: 25%;
		margin-right: -75px;
		padding-right: 30px;
	}
}

/*--------------------------------------------------------------
4.3 Elements
--------------------------------------------------------------*/
/**
 * This is the site logo, its in a span so we can set a width and a height
 * depending on the size of the image used as a logo
 */
 .a--site-logo > span {
	display: block;
	text-indent: -9999px;
}

/* Placeholder if a site logo isn't added to site */
.a--site-logo--placeholder > span {
	background: url(assets/img/placeholders/campaign-pro-logo.png) center center no-repeat;
	width: 151px;
	height: 23px;
}

.site-header__supplementary__social ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-header__supplementary--with-search .site-header__supplementary__social ul {
	margin: 0 61px 0 0;
}

.site-header__supplementary--with-search .site-header__supplementary__social ul:after {
	content: '';
	position: absolute;
	width: 1px;
	height: 50%;
	background: #ccc;
	right: 46px;
	top: 0;
	bottom: 0;
	margin: auto;
	transform: rotate(2deg);
}

.site-header__supplementary__social li {
	float: left;
}

/*--------------------------------------------------------------
4.3.1 Responsive
--------------------------------------------------------------*/
/* 2x version that displays on high-res screens */
@media only screen and (-Webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) {
	.a--site-logo--placeholder > span {
		background: url(assets/img/placeholders/campaign-pro-logo@2x.png) center center no-repeat;
		background-size: contain;
	}
}

@media (min-width: 768px) {
	.a--site-logo > span {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
		z-index: 99999;
	}

	.site-header__supplementary--with-search .site-header__supplementary__social ul {
		margin: 0 60px 0 0;
	}

	.site-header__supplementary--with-search .site-header__supplementary__social ul:after {
		right: 45px;
		transform: rotate(4deg);
	}
}

/*--------------------------------------------------------------
4.4 Links
--------------------------------------------------------------*/
.a--site-logo {
	display: inline-block;
}

/* if there's no menu or cta in the header then we'll be center aligning the logo */
.site-header__main--only-logo .a--site-logo,
.site-header__main--only-logo .a--site-logo > span /* this is an element, but same declarations so plonking here */ {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}

.cp-social-icon {
	box-shadow: 0 5px 15px rgba(0,0,0,.1);
	width: 30px;
	background: #ffffff;
	padding: 0;
	display: inline-block;
	text-indent: -9999px;
	position: relative;
}

.cp-social-icon:before {
	content: '';
	position: absolute;
	width: 26px;
	height: 26px;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #404040;
}

.cp-social-icon:hover:before,
.cp-social-icon:active:before,
.cp-social-icon:focus:before {
	background-color: midnightblue;
}

/* all the different social icons */
.cp-social-icon--etsy:before{background-image:url(assets/img/social-icons/png/social-icon_etsy.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_etsy.svg);}
.cp-social-icon--evernote:before{background-image:url(assets/img/social-icons/png/social-icon_evernote.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_evernote.svg);}
.cp-social-icon--facebook:before{background-image:url(assets/img/social-icons/png/social-icon_facebook.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_facebook.svg);}
.cp-social-icon--favorite:before{background-image:url(assets/img/social-icons/png/social-icon_favorite.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_favorite.svg);}
.cp-social-icon--flikr:before{background-image:url(assets/img/social-icons/png/social-icon_flikr.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_flikr.svg);}
.cp-social-icon--foursquare:before{background-image:url(assets/img/social-icons/png/social-icon_foursquare.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_foursquare.svg);}
.cp-social-icon--github:before{background-image:url(assets/img/social-icons/png/social-icon_github.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_github.svg);}
.cp-social-icon--googledrive:before{background-image:url(assets/img/social-icons/png/social-icon_googledrive.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_googledrive.svg);}
.cp-social-icon--googleplay:before{background-image:url(assets/img/social-icons/png/social-icon_googleplay.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_googleplay.svg);}
.cp-social-icon--googleplus:before{background-image:url(assets/img/social-icons/png/social-icon_googleplus.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_googleplus.svg);}
.cp-social-icon--habrahabr:before{background-image:url(assets/img/social-icons/png/social-icon_habrahabr.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_habrahabr.svg);}
.cp-social-icon--instagram:before{background-image:url(assets/img/social-icons/png/social-icon_instagram.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_instagram.svg);}
.cp-social-icon--jsfiddle:before{background-image:url(assets/img/social-icons/png/social-icon_jsfiddle.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_jsfiddle.svg);}
.cp-social-icon--kickstarter:before{background-image:url(assets/img/social-icons/png/social-icon_kickstarter.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_kickstarter.svg);}
.cp-social-icon--like:before{background-image:url(assets/img/social-icons/png/social-icon_like.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_like.svg);}
.cp-social-icon--line:before{background-image:url(assets/img/social-icons/png/social-icon_line.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_line.svg);}
.cp-social-icon--linkedin:before{background-image:url(assets/img/social-icons/png/social-icon_linkedin.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_linkedin.svg);}
.cp-social-icon--livejournal:before{background-image:url(assets/img/social-icons/png/social-icon_livejournal.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_livejournal.svg);}
.cp-social-icon--mail:before{background-image:url(assets/img/social-icons/png/social-icon_mail.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_mail.svg);}
.cp-social-icon--map:before{background-image:url(assets/img/social-icons/png/social-icon_map.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_map.svg);}
.cp-social-icon--medium:before{background-image:url(assets/img/social-icons/png/social-icon_medium.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_medium.svg);}
.cp-social-icon--messenger:before{background-image:url(assets/img/social-icons/png/social-icon_messenger.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_messenger.svg);}
.cp-social-icon--ok:before{background-image:url(assets/img/social-icons/png/social-icon_ok.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_ok.svg);}
.cp-social-icon--periscope:before{background-image:url(assets/img/social-icons/png/social-icon_periscope.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_periscope.svg);}
.cp-social-icon--phone:before{background-image:url(assets/img/social-icons/png/social-icon_phone.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_phone.svg);}
.cp-social-icon--photobucket:before{background-image:url(assets/img/social-icons/png/social-icon_photobucket.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_photobucket.svg);}
.cp-social-icon--pinterest:before{background-image:url(assets/img/social-icons/png/social-icon_pinterest.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_pinterest.svg);}
.cp-social-icon--pocket:before{background-image:url(assets/img/social-icons/png/social-icon_pocket.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_pocket.svg);}
.cp-social-icon--producthunt:before{background-image:url(assets/img/social-icons/png/social-icon_producthunt.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_producthunt.svg);}
.cp-social-icon--quora:before{background-image:url(assets/img/social-icons/png/social-icon_quora.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_quora.svg);}
.cp-social-icon--reddit:before{background-image:url(assets/img/social-icons/png/social-icon_reddit.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_reddit.svg);}
.cp-social-icon--rss:before{background-image:url(assets/img/social-icons/png/social-icon_rss.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_rss.svg);}
.cp-social-icon--send:before{background-image:url(assets/img/social-icons/png/social-icon_send.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_send.svg);}
.cp-social-icon--shopify:before{background-image:url(assets/img/social-icons/png/social-icon_shopify.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_shopify.svg);}
.cp-social-icon--sketch:before{background-image:url(assets/img/social-icons/png/social-icon_sketch.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_sketch.svg);}
.cp-social-icon--skype:before{background-image:url(assets/img/social-icons/png/social-icon_skype.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_skype.svg);}
.cp-social-icon--slack:before{background-image:url(assets/img/social-icons/png/social-icon_slack.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_slack.svg);}
.cp-social-icon--slideshare:before{background-image:url(assets/img/social-icons/png/social-icon_slideshare.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_slideshare.svg);}
.cp-social-icon--snapchat:before{background-image:url(assets/img/social-icons/png/social-icon_snapchat.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_snapchat.svg);}
.cp-social-icon--stackoverflow:before{background-image:url(assets/img/social-icons/png/social-icon_stackoverflow.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_stackoverflow.svg);}
.cp-social-icon--stumbleupon:before{background-image:url(assets/img/social-icons/png/social-icon_stumbleupon.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_stumbleupon.svg);}
.cp-social-icon--swarm:before{background-image:url(assets/img/social-icons/png/social-icon_swarm.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_swarm.svg);}
.cp-social-icon--tripadvisor:before{background-image:url(assets/img/social-icons/png/social-icon_tripadvisor.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_tripadvisor.svg);}
.cp-social-icon--tumblr:before{background-image:url(assets/img/social-icons/png/social-icon_tumblr.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_tumblr.svg);}
.cp-social-icon--twitter:before{background-image:url(assets/img/social-icons/png/social-icon_twitter.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_twitter.svg);}
.cp-social-icon--upwork:before{background-image:url(assets/img/social-icons/png/social-icon_upwork.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_upwork.svg);}
.cp-social-icon--viadeo:before{background-image:url(assets/img/social-icons/png/social-icon_viadeo.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_viadeo.svg);}
.cp-social-icon--vimeo:before{background-image:url(assets/img/social-icons/png/social-icon_vimeo.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_vimeo.svg);}
.cp-social-icon--vk:before{background-image:url(assets/img/social-icons/png/social-icon_vk.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_vk.svg);}
.cp-social-icon--vscogrid:before{background-image:url(assets/img/social-icons/png/social-icon_vscogrid.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_vscogrid.svg);}
.cp-social-icon--web:before{background-image:url(assets/img/social-icons/png/social-icon_web.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_web.svg);}
.cp-social-icon--windows:before{background-image:url(assets/img/social-icons/png/social-icon_windows.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_windows.svg);}
.cp-social-icon--wordpress:before{background-image:url(assets/img/social-icons/png/social-icon_wordpress.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_wordpress.svg);}
.cp-social-icon--xing:before{background-image:url(assets/img/social-icons/png/social-icon_xing.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_xing.svg);}
.cp-social-icon--yelp:before{background-image:url(assets/img/social-icons/png/social-icon_yelp.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_yelp.svg);}
.cp-social-icon--youtube:before{background-image:url(assets/img/social-icons/png/social-icon_youtube.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_youtube.svg);}
.cp-social-icon--500px:before{background-image:url(assets/img/social-icons/png/social-icon_500px.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_500px.svg);}
.cp-social-icon--aboutme:before{background-image:url(assets/img/social-icons/png/social-icon_aboutme.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_aboutme.svg);}
.cp-social-icon--amazon:before{background-image:url(assets/img/social-icons/png/social-icon_amazon.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_amazon.svg);}
.cp-social-icon--android:before{background-image:url(assets/img/social-icons/png/social-icon_android.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_android.svg);}
.cp-social-icon--angellist:before{background-image:url(assets/img/social-icons/png/social-icon_angellist.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_angellist.svg);}
.cp-social-icon--apple:before{background-image:url(assets/img/social-icons/png/social-icon_apple.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_apple.svg);}
.cp-social-icon--behance:before{background-image:url(assets/img/social-icons/png/social-icon_behance.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_behance.svg);}
.cp-social-icon--bookmate:before{background-image:url(assets/img/social-icons/png/social-icon_bookmate.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_bookmate.svg);}
.cp-social-icon--buffer:before{background-image:url(assets/img/social-icons/png/social-icon_buffer.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_buffer.svg);}
.cp-social-icon--codepen:before{background-image:url(assets/img/social-icons/png/social-icon_codepen.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_codepen.svg);}
.cp-social-icon--coub:before{background-image:url(assets/img/social-icons/png/social-icon_coub.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_coub.svg);}
.cp-social-icon--delicious:before{background-image:url(assets/img/social-icons/png/social-icon_delicious.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_delicious.svg);}
.cp-social-icon--deviantart:before{background-image:url(assets/img/social-icons/png/social-icon_deviantart.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_deviantart.svg);}
.cp-social-icon--digg:before{background-image:url(assets/img/social-icons/png/social-icon_digg.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_digg.svg);}
.cp-social-icon--dribbble:before{background-image:url(assets/img/social-icons/png/social-icon_dribbble.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_dribbble.svg);}
.cp-social-icon--dropbox:before{background-image:url(assets/img/social-icons/png/social-icon_dropbox.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_dropbox.svg);}
.cp-social-icon--ello:before{background-image:url(assets/img/social-icons/png/social-icon_ello.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_ello.svg);}
.cp-social-icon--envato:before{background-image:url(assets/img/social-icons/png/social-icon_envato.png);background-image:linear-gradient(transparent,transparent),url(assets/img/social-icons/svg/social-icon_envato.svg);}

/* This is a button, but its not part of a form, so plonking it in 'Links' */
.site-header__supplementary__btn--search-js {
	top: 0;
	border: 0;
	position: absolute;
	right: 6.5%;
	background-color: #ffffff;
	width: 30px;
	text-indent: -9999px;
	padding: 0;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	height: 100%;
	overflow: hidden;
	box-shadow: 0 5px 15px rgba(0,0,0,.1);
	z-index: 99;
}

.site-header__supplementary__btn--search-js:before {
	left: 0;
	background-color: #404040;
	width: 100%;
	height: 30px;
	background-position: center -6px;
}

/* Multi-Selector, Search: '.site-header__supplementary__btn--search-js:before' */

.site-header__supplementary__btn--search-js:hover,
.site-header__supplementary__btn--search-js:active,
.site-header__supplementary__btn--search-js:focus {
	background-color: #ffffff;
	box-shadow: 0 5px 15px rgba(0,0,0,.1);
}

.site-header__supplementary__btn--search-js:hover:before,
.site-header__supplementary__btn--search-js:active:before,
.site-header__supplementary__btn--search-js:focus:before {
	background-color: midnightblue;
}

.open.site-header__supplementary__btn--search-js:before,
.open.site-header__supplementary__btn--search-js:after {
	content: '';
	background: none;
	position: absolute;
	height: 0;
	border-top: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 6px solid #404040;
	left: 11px;
}

.open.site-header__supplementary__btn--search-js:after {
	border-left-color: #fff;
	left: 9px;
	top: 8px;
}

.open.site-header__supplementary__btn--search-js:hover:before,
.open.site-header__supplementary__btn--search-js:active:before,
.open.site-header__supplementary__btn--search-js:focus:before {
	border-left-color: midnightblue;
}

.site-header__supplementary__latest a {
	border-bottom: 1px dotted #737373;
}

.site-header__cta {
	white-space: nowrap;
	text-align: center;
	position: absolute;
	right: 6.5%;
	top: 100%;
	margin-top: -9px;
	width: auto !important;
	z-index: 9998;
}

/* adds a white rectangle behind header cta to add a bit of padding either site of button */
.site-header__cta:before {
	content: '';
	position: absolute;
	width: 130%;
	height: 8px;
	background: #fff;
	left: -15%;
	top: 2px;
}

.site-header__cta.is-stuck:before {
	content: none;
}

/**
 * Using body as additional selector to overwrite default hover, active and focus
 * states for link.
 */
body .main-navigation .site-header__cta__btn {
	background-color: #f00000;
	text-transform: uppercase;
	color: #ffffff;
	font-weight: 700;
	font-size: .7em;
	padding: 8px 17px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
}

body .site-header__cta__btn.site-header__cta__btn--donate-js {
	padding-right: 26px;
}

.main-navigation .site-header__cta__btn > span {
	position: relative;
	z-index: 1;
	display: inline-block;
	line-height: 1em;
	border-bottom-color: #f00000; /* this is here because child span inherits color when select class added to site-header__cta__btn */
}

.site-header__cta__btn__arrow {
	content: '';
	position: absolute;
	display: inline-block;
	border-top: 6px solid #ffffff;
	border-right: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 6px solid transparent;
	right: -17px;
	top: 2px;
}

.site-header__cta__btn__arrow + .site-header__cta__btn__arrow {
	border-top-color: #f00000;
	top: 0;
}

.not-selected .site-header__cta__btn__arrow {
	border-bottom-color: transparent !important;
}

.selected .site-header__cta__btn__arrow {
	border-top-color: transparent !important;
	border-bottom-color: #ffffff;
	top: -5px;
}

.selected .site-header__cta__btn__arrow + .site-header__cta__btn__arrow {
	border-bottom-color: inherit;
	top: -3px;
}

.site-header__cta__btn--bright-background:hover .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.site-header__cta__btn--bright-background:active .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.site-header__cta__btn--bright-background:focus .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before {
	content: "";
	position: absolute;
	top: -6px;
	left: -6px;
	border: inherit;
	border-top-color: rgba(0, 0, 0, 0.25);
}

.selected.site-header__cta__btn--bright-background:hover .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.selected.site-header__cta__btn--bright-background:active .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.selected.site-header__cta__btn--bright-background:focus .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before {
	border-top-color: inherit;
	border-bottom-color: rgba(0, 0, 0, 0.25);
}

.site-header__cta__btn--dark-background:hover .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.site-header__cta__btn--dark-background:active .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.site-header__cta__btn--dark-background:focus .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before {
	content: "";
	position: absolute;
	top: -6px;
	left: -6px;
	border: inherit;
	border-top-color: rgba(255, 255, 255, 0.25);
}

.selected.site-header__cta__btn--dark-background:hover .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.selected.site-header__cta__btn--dark-background:active .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before,
.selected.site-header__cta__btn--dark-background:focus .site-header__cta__btn__arrow + .site-header__cta__btn__arrow:before {
	border-top-color: inherit;
	border-bottom-color: rgba(255, 255, 255, 0.25);
}

/*--------------------------------------------------------------
4.4.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.site-header__supplementary__btn--search-js,
	.site-header__cta {
		right: 10%;
	}
}

@media (min-width: 768px) {
	/* this is the de facto site logo wrapper, with the site logo being '.a--site-logo > span' */
	.a--site-logo {
		position: absolute;
		top: 0;
		height: 100%;
	}

	.cp-social-icon {
		height: 34px;
	}

	.site-header__supplementary__btn--search-js {
		right: 9%;
		border: 0;
	}

	.open.site-header__supplementary__btn--search-js:after {
		top: 11px;
	}

	.site-header__cta {
		right: 0;
	}
}

@media (min-width: 768px) and (max-width: 1119px) {
	.site-header__cta.is-stuck {
		right: 9%;
	}
}

@media (min-width: 1120px) {
	.a--site-logo {
		width: 25%;
	}

	.site-header__supplementary__btn--search-js {
		right: 12.5%;
		margin-right: -75px;
	}

	.site-header__cta {
		position: relative;
		display: table-cell;
		vertical-align: middle;
		padding-left: 23px;
		text-align: right;
	}

	body .main-navigation .site-header__cta__btn {
		padding: 12px 25px;
		font-size: .8em;
		display: inline-block;
		vertical-align: middle;
	}
	
	body .site-header__cta__btn.site-header__cta__btn--donate-js {
		padding-right: 36px;
	}
}

/*--------------------------------------------------------------
4.5 Forms
--------------------------------------------------------------*/
.site-header__supplementary__search-js .search-field {
	width: 90%;
	height: 28px;
	padding: 0 10px;
	font-size: .8em;
	font-style: italic;
	border: 0;
	border-left: 1px solid #ccc;
}

.site-header__supplementary__search-js form.search-form .search-submit {
	height: 28px;
	box-shadow: none;
	border: 0;
	background-position: center -7px;
}

/*--------------------------------------------------------------
4.5.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.site-header__supplementary__search-js .search-field {
		height: 34px;
	}

	.site-header__supplementary__search-js form.search-form .search-submit {
		height: 34px;
		background-position: center -4px;
	}
}

/*--------------------------------------------------------------
4.6 Donations
--------------------------------------------------------------*/
/*--------------------------------------------------------------
4.6.1 Typography
--------------------------------------------------------------*/
.site-header__donation__heading {
	font-size: .8em;
	margin-bottom: 2px;
	font-style: italic;
	display: block;
}

.site-header__donation p {
	margin: 0;
}

/*--------------------------------------------------------------
4.6.2 Blocks
--------------------------------------------------------------*/
.site-header__donation {
	display: none; /* displayed via js (button click) */
	position: absolute;
	right: -2px;
	width: 220px;
	padding: 20px 30px;
	z-index: 1;
	text-align: left;
	white-space: normal;
	margin-top: 2px;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
	background: #fff;
	border: 1px solid #e8e8e8;
	text-transform: none;
}

.site-header__donation:before {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 6px solid #cecece;
    top: -7px;
	right: 11px;
}

/* added via js when donate button clicked */
.site-header__donation--show-js {
	display: block;
}

.site-header__donation .asp_product_item_amount_input_container {
	display: none;
}

body .site-header__donation .cp-donations--quick__pop-up {
	display: inline-block;
	margin-top: 9px;
}

/*--------------------------------------------------------------
4.6.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 1120px) {
	.site-header__donation {
		margin-right: -75px;
	}

	.site-header__donation:before {
		right: 21px;
	}
}

/*--------------------------------------------------------------
4.6.3 Links
--------------------------------------------------------------*/
.site-header__donation a {
	display: inline;
	color: royalblue;
	font-weight: normal;
}

/*--------------------------------------------------------------
4.6.4 Forms
--------------------------------------------------------------*/
/* Input for the amount */
.site-header__donation .js-cp-donations--quick__input--any-amount {
	border: 0;
	height: 40px;
	padding: 0 10px;
	float: left;
	width: 85%;
	background: #eee;
}

.site-header__donation .cp-currency-symbol {
	display: block;
	width: 15%;
	float: left;
	vertical-align: middle;
	padding-top: 8px;
	font-size: .8em;
	height: 40px;
	border-top: 1px solid #fff;
	border-right: 2px solid #fff;
	border-bottom: 1px solid #fff;
	text-align: center;
	background: #f5f5f5;
}

/*--------------------------------------------------------------
5 Footer
--------------------------------------------------------------*/
/*--------------------------------------------------------------
5.1 Typography
--------------------------------------------------------------*/
/* resets heading margin */
.site-footer__main__heading {
	margin: 0 0 .5em 0;
	font-size: .9em;
}

/*--------------------------------------------------------------
5.1.1 Responsive
--------------------------------------------------------------*/
/* MAX WIDTH */
@media (max-width: 767px) {
  /* Hidden on mobile */
  .site-footer__main__heading {
    display: none;
  }
}

/*--------------------------------------------------------------
5.2 Blocks
--------------------------------------------------------------*/
.site-footer__supplementary {
	height: auto;
	width: 100%;
	float: left;
	border-bottom: 0;
	border-top: 1px solid #ccc;
}

/* Multi-Selector, Search: '.site-footer__supplementary' */

.site-footer__supplementary__btn-wrapper {
	margin: 0;
	display: inline-block;
}

.site-footer__supplementary__text {
	float: right;
	text-align: right;
	margin: 0;
	padding: 15px 0 15px 15px;
	font-size: .9em;
	line-height: 1.6em;
	font-style: italic;
	position: relative;
}

.site-footer__main,
.site-footer__colophon {
	position: relative;
	background: #333;
	color: #fff;
	overflow: hidden; /* clears floats */
	padding-top: 42px;
	padding-bottom: 42px;
}

.site-footer__main {
	border-top: 1px solid #cccccc;
}

/* Multi-Selector, Search: '.site-footer__main' */

.site-footer__colophon {
	border-top: 1px solid #cccccc;
	font-size: .75em;
}

/* Multi-Selector, Search: '.site-footer__colophon' */

.site-footer__colophon__text > * {
	margin: 0 0 1.5em;
}

/* The last accordion wrapper, adds border-bottom to round the borders off */
.js-accordion--footer-mobile--last {
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.js-accordion--footer-mobile .cp-accordion__panel {
  padding: 10px 0;
  background: none;
  border-top: 1px dashed rgba(255, 255, 255, 0.18);
}

/*--------------------------------------------------------------
5.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.site-footer__supplementary__text {
		max-width: 65%;
	}
}

@media (min-width: 768px) {
	.site-footer__supplementary__btn-wrapper {
		float: left;
	}

	.site-footer__main__col--half {
		width: 48%;
		margin-right: 2%;
		float: left;
	}

	.site-footer__main__col--third {
		width: 32%;
		margin-right: 2%;
		float: left;
	}

	.site-footer__main__col--quarter {
		width: 23.5%;
		margin-right: 2%;
		float: left;
	}

	.site-footer__main__col--fifth {
		width: 18.4%;
		margin-right: 2%;
		float: left;
		margin-top: 1em;
		margin-bottom: 1em;
	}

	.site-footer__main__col--last {
		margin-right: 0;
	}

	/* Hidden on desktop */
  .js-accordion--footer-mobile {
    display: none;
  }
}

/*--------------------------------------------------------------
5.3 Elements
--------------------------------------------------------------*/
/* menus in footer */
.site-footer__main ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .8em;
	color: #cacaca;
}

.site-footer__main ul ul {
	font-size: 1em;
}

.site-footer__main li {
	margin-bottom: 0; /* this overwrites a margin added in the admin, but doing it in styles.css too to minimise divergence */
}

.site-footer__colophon__built-with-msg {
	right: 6.5%;
	margin: 0;
	overflow: hidden;
	position: absolute;
	z-index: 1;
	bottom: -3px;
}

.site-footer__colophon__built-with-msg:before {
	border: 0;
	box-shadow: none;
}

/* Multi-Selector, Search: '.site-footer__colophon__built-with-msg:before' */

/* Arrow icon on mobile accordion */
.js-accordion--footer-mobile button.cp-accordion__header > span:before,
.js-accordion--footer-mobile .cp-accordion__header > span:after {
	content: "■";
	height: 10px;
	width: 2px;
	right: 4px;
	font-size: 4em;
	line-height: 0;
	text-indent: -15px;
	overflow: hidden;
}

/* Arrow icon on mobile accordion (open state) */
.js-accordion--footer-mobile .cp-accordion__header[aria-expanded=true] > span:before {
	content: none;
}

.js-accordion--footer-mobile .cp-accordion__header > span:after {
	height: 2px;
	width: 10px;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

/*--------------------------------------------------------------
5.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.site-footer__colophon__built-with-msg {
		right: 10%;
	}
}

@media (min-width: 768px) {
	.site-footer__colophon__built-with-msg {
		right: 18%;
	}
}

@media (min-width: 1120px) {
	.site-footer__colophon__built-with-msg {
		right: 25%;
	}
}

/* MAX WIDTH */
@media (max-width: 767px) {
	/* Hidden on mobile (ul) */
	.site-footer__main__desktop-list {
		display: none;
	}
}

/*--------------------------------------------------------------
5.4 Links (inc buttons)
--------------------------------------------------------------*/
/* menu links */
.site-footer__main ul a {
	display: inline-block;
	color: inherit;
	margin-bottom: 10px;
}

.site-footer__colophon a {
	color: inherit;
}

.site-footer__main ul a:hover,
.site-footer__main ul a:active,
.site-footer__main ul a:focus,
.site-footer__colophon a:hover,
.site-footer__colophon a:active,
.site-footer__colophon a:focus {
	text-decoration: underline;
}

.site-footer__supplementary__btn {
	display: block;
}

/* Multi-Selector, Search: '.site-footer__supplementary__btn' */

/* Multi-Selector, Search: '.site-footer__supplementary__btn--dark-background:hover:before' */
/* Multi-Selector, Search: '.site-footer__supplementary__btn--dark-background:active:before' */
/* Multi-Selector, Search: '.site-footer__supplementary__btn--dark-background:focus:before' */

/* Multi-Selector, Search: '.site-footer__supplementary__btn > span' */

.site-footer__colophon__built-with-msg > a {
	height: 45px;
	width: 115px;
	background-image: url(assets/img/placeholders/crafted-with-campaign-pro-footer-logo.png);
	background-repeat: no-repeat;
	background-position: center;
	display: inline-block;
	text-indent: -99999px;
}

/* Button to open accordion (on mobile only) */
.js-accordion--footer-mobile button.cp-accordion__header {
  font-size: .9em;
  color: #fff;
  padding: 8px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
}

/* Button to open accordion (on mobile only) - open state */
.js-accordion--footer-mobile .cp-accordion__header[aria-expanded=true] {
  background: none;
}

/**
 * Button to open accordion (on mobile only) - non-footer accordions have styling on
 * :after, this overites it.
 */
.js-accordion--footer-mobile .cp-accordion__header:after {
  content: none;
}

/*--------------------------------------------------------------
5.4.1 Responsive
--------------------------------------------------------------*/
/* HiDPI support */
@media (-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi),
(min-resolution: 1.25dppx) {
	.site-footer__colophon__built-with-msg > a {
		background-image: url(assets/img/placeholders/crafted-with-campaign-pro-footer-logo@2x.png);
		background-size: 92px;
	}
}

/*--------------------------------------------------------------
6 Modules
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.1 Multi-Selector Styling
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.1.1 Multiple Selector Categories (e.g. a block and an element)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.1.2 Blocks
--------------------------------------------------------------*/
/* Base styles for gradient */
.cp-hero:after,
.cp-section:after,
.cp-section__img-overlay:after,
.cp-action:after,
.cp-video__placeholder:after,
.cp-grid__block:after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center bottom -3px;
	background-repeat: no-repeat;
}

.cp-action:after {
	background-position: center bottom 100px;
}

.cp-gradient-xxs:after {
	content: "";
	background-image: url(assets/img/gradients/b-t/cp-gradient-vertical-xxs.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/b-t/cp-gradient-vertical-xxs.svg);
}

.cp-gradient-xs:after {
	content: "";
	background-image: url(assets/img/gradients/b-t/cp-gradient-vertical-xs.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/b-t/cp-gradient-vertical-xs.svg);
}

.cp-gradient-s:after {
	content: "";
	background-image: url(assets/img/gradients/b-t/cp-gradient-vertical-s.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/b-t/cp-gradient-vertical-s.svg);
}

.cp-gradient-m:after {
	content: "";
	background-image: url(assets/img/gradients/b-t/cp-gradient-vertical-m.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/b-t/cp-gradient-vertical-m.svg);
}

.cp-gradient-l:after {
	content: "";
	background-image: url(assets/img/gradients/b-t/cp-gradient-vertical-l.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/b-t/cp-gradient-vertical-l.svg);
}

.cp-gradient-xl:after {
	content: "";
	background-image: url(assets/img/gradients/b-t/cp-gradient-vertical-xl.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/b-t/cp-gradient-vertical-xl.svg);
}

/* Sets the position of the gradient for l-r (left to right) */
.cp-gradient-xxs--l-r:after,
.cp-gradient-xs--l-r:after,
.cp-gradient-s--l-r:after,
.cp-gradient-m--l-r:after,
.cp-gradient-l--l-r:after,
.cp-gradient-xl--l-r:after {
	content: "";
	background-position: center left;
	background-image: url(assets/img/gradients/l-r/cp-gradient-l-r-xxs.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/l-r/cp-gradient-l-r-xxs.svg);
}

.cp-gradient-xs--l-r:after {
	background-image: url(assets/img/gradients/l-r/cp-gradient-l-r-xs.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/l-r/cp-gradient-l-r-xs.svg);
}

.cp-gradient-s--l-r:after {
	background-image: url(assets/img/gradients/l-r/cp-gradient-l-r-s.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/l-r/cp-gradient-l-r-s.svg);
}

.cp-gradient-m--l-r:after {
	background-image: url(assets/img/gradients/l-r/cp-gradient-l-r-m.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/l-r/cp-gradient-l-r-m.svg);
}

.cp-gradient-l--l-r:after {
	background-image: url(assets/img/gradients/l-r/cp-gradient-l-r-l.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/l-r/cp-gradient-l-r-l.svg);
}

.cp-gradient-xl--l-r:after {
	background-image: url(assets/img/gradients/l-r/cp-gradient-l-r-xl.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/l-r/cp-gradient-l-r-xl.svg);
}

.cp-hero__content-container {
	position: relative;
	z-index: 1;
}

/* Sets the position of the gradient for r-l (right to left) */
.cp-gradient-xxs--r-l:after,
.cp-gradient-xs--r-l:after,
.cp-gradient-s--r-l:after,
.cp-gradient-m--r-l:after,
.cp-gradient-l--r-l:after,
.cp-gradient-xl--r-l:after {
	content: "";
	background-position: center right;
	background-image: url(assets/img/gradients/r-l/cp-gradient-r-l-xxs.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/r-l/cp-gradient-r-l-xxs.svg);
}

.cp-gradient-xs--r-l:after {
	background-image: url(assets/img/gradients/r-l/cp-gradient-r-l-xs.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/r-l/cp-gradient-r-l-xs.svg);
}

.cp-gradient-s--r-l:after {
	background-image: url(assets/img/gradients/r-l/cp-gradient-r-l-s.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/r-l/cp-gradient-r-l-s.svg);
}

.cp-gradient-m--r-l:after {
	background-image: url(assets/img/gradients/r-l/cp-gradient-r-l-m.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/r-l/cp-gradient-r-l-m.svg);
}

.cp-gradient-l--r-l:after {
	background-image: url(assets/img/gradients/r-l/cp-gradient-r-l-l.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/r-l/cp-gradient-r-l-l.svg);
}

.cp-gradient-xl--r-l:after {
	background-image: url(assets/img/gradients/r-l/cp-gradient-r-l-xl.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/gradients/r-l/cp-gradient-r-l-xl.svg);
}

/* Used to add opacity and colour to hero/section background image (colour and opacity added inline as chosen by user) */
.cp-hero__opacity,
.cp-section__opacity,
.cp-action__opacity,
.cp-video__opacity {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
}

/*--------------------------------------------------------------
6.1.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.cp-big-text,
	.cp-stats {
		font-size: .85em;
	}
}

/*--------------------------------------------------------------
6.2 Hero
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.2.1 Typography
--------------------------------------------------------------*/
#content .p--cp-hero,
#content .heading--cp-hero {
	color: #fff;
	font-weight: 700;
	margin: 0;
	font-size: 2em;
	line-height: 1.25em;
}

/**
 * As 'the_content()' wraps 'a tags' in 'p tags' we put one in (and style it as needed).
 * Targeting with '#content' to overwrite default p.
 */
#content .p--cp-hero--btn-wrapper {
	margin: 1em 0 0;
}

/*--------------------------------------------------------------
6.2.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .p--cp-hero,
	#content .heading--cp-hero {
		font-size: 2.2em;
	}
}

@media (min-width: 768px) {
	#content .p--cp-hero,
	#content .heading--cp-hero {
		font-size: 2.5em;
	}
}

@media (min-width: 1120px) {
	#content .p--cp-hero,
	#content .heading--cp-hero {
		font-size: 3em;
	}
}

/*--------------------------------------------------------------
6.2.2 Blocks
--------------------------------------------------------------*/
/* Main hero wrapper */
.cp-hero {
	position: relative;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding: 200px 6.5% 100px;
	background-color: #5796da;
}

/* Multi-Selector, Search: '.cp-hero:after' */

/* Multi-Selector, Search: '.cp-hero__opacity' */

/*--------------------------------------------------------------
6.2.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-hero {
		padding: 200px 10% 100px;
	}
}

@media (min-width: 768px) {
	.cp-hero {
		padding: 250px 18% 100px;
	}
}

@media (min-width: 1120px) {
	.cp-hero {
		padding: 400px 25% 100px;
	}

	.hfeed .hentry .cp-hero {
		padding: 400px 15% 100px;
	}
}

/*--------------------------------------------------------------
6.2.3 Links
--------------------------------------------------------------*/
/* Multi-Selector, Search: '.a--cp-hero' */

/*--------------------------------------------------------------
6.3 Accordions
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.3.1 Blocks
--------------------------------------------------------------*/
/* Accordion panel hidden (unless its clicked open by user) */
.cp-accordion__panel[aria-hidden=true] {
	display: none;
}

.cp-accordion__panel {
	overflow: hidden;
	padding: 25px 6.5%;
	background: #eeeeee;
}

.cp-accordion__panel > * {
	margin: 0 0 1.5em !important;
}

/*--------------------------------------------------------------
6.3.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-accordion__panel {
		padding: 30px 10%;
	}
}

@media (min-width: 768px) {
	.cp-accordion__panel {
		padding: 35px 18%;
	}
}

@media (min-width: 1120px) {
	.cp-accordion__panel {
		padding: 40px 25%;
	}

	.hfeed .hentry .cp-accordion__panel {
		padding: 40px 15%;
	}
}

/*--------------------------------------------------------------
6.3.2 Elements
--------------------------------------------------------------*/
.cp-accordion__header > span {
	padding-right: 65px;
	position: relative;
	display: block;
	z-index: 1;
}

.cp-accordion__header > span:before {
	right: 0;
	background-position: center -768px;
	background-color: #404040;
}

#comments .cp-accordion__header > span:before {
	background-position: center -485px;
}

/* Multi-Selector, Search: '.cp-accordion__header > span:before' */

.cp-accordion__header:hover > span:before,
.cp-accordion__header:active > span:before,
.cp-accordion__header:focus > span:before {
	background-color: midnightblue;
}

.cp-accordion__header[aria-expanded=true] > span:before {
	background-position: center -707px;
}

#comments .cp-accordion__header[aria-expanded=true] > span:before {
	background-position: center -422px;
}

/*--------------------------------------------------------------
6.3.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.cp-accordion__header > span {
		padding-right: 80px;
	}

	.cp-accordion__header > span:before {
		background-position: center -830px;
		height: 60px;
		width: 60px;
	}

	#comments .cp-accordion__header > span:before {
		background-position: center -546px;
	}

	.cp-accordion__header[aria-expanded=true] > span:before {
		background-position: center -909px;
	}

	#comments .cp-accordion__header[aria-expanded=true] > span:before {
		background-position: center -627px;
	}
}

/*--------------------------------------------------------------
6.3.3 Links (inc Buttons)
--------------------------------------------------------------*/
/* Button user clicks to open accordion */
.cp-accordion__header {
	border: 0;
	padding: 30px 10%;
	width: 100%;
	text-align: left;
	font-size: 1.1em;
	text-transform: none;
	position: relative;
	background: none;
	font-weight: 700;
	color: #404040;
}

.cp-accordion__header:hover,
.cp-accordion__header:active,
.cp-accordion__header:focus {
	background: none;
}

.cp-accordion__header[aria-expanded=true] {
	background: #eeeeee;
}

.cp-accordion__header:hover,
.cp-accordion__header:active,
.cp-accordion__header:focus {
	color: midnightblue;
}

.cp-accordion__header:after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	box-shadow: rgba(0,0,0,.1)0 -2px 22px;
	height: 100%;
	transform: rotate(-1deg);
	background-color: #fff;
	left: 0;
	right: 0;
	margin: 0 6.5%;
	bottom: 0;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
}

.cp-accordion__header[aria-expanded=true]:after {
	box-shadow: rgba(0,0,0,.1)0 -10px 22px;
}

/*--------------------------------------------------------------
6.3.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.cp-accordion__header {
		padding: 30px 18%;
		font-size: 1.2em;
	}

	.cp-accordion__header:after {
		margin: 0 10%;
	}
}

@media (min-width: 1120px) {
	.cp-accordion__header {
		padding: 35px 25%;
		font-size: 1.4em;
	}

	.hfeed .hentry .cp-accordion__header {
		padding: 35px 15%;
	}

	.cp-accordion__header:after {
		margin: 0 15%;
	}

	.hfeed .hentry .cp-accordion__header:after {
		margin: 0 5%;
	}
}

/*--------------------------------------------------------------
6.5 Text
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.5.1 Typography
--------------------------------------------------------------*/
.is-style-cp-intro-text {
	font-size: 1.15em;
	font-weight: 700;
}

/*--------------------------------------------------------------
6.5.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.is-style-cp-intro-text {
		font-size: 1.25em;
	}
}

/*--------------------------------------------------------------
6.6 Stats
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.1 Blocks
--------------------------------------------------------------*/
.cp-stats {
	overflow: hidden;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	-ms-word-wrap: initial;
		word-wrap: initial;
}

.cp-stats + .cp-stats {
	border-top: 0;
}

/* Multi-Selector, Search: '.cp-stats' */

/* Multi-Selector, Search: '.cp-stats.alignfull' */

.cp-stats--no-border-top {
	border-top: 0;
	border-bottom: 1px solid #eee;
}

.cp-stats--center {
	text-align: center;
}

.cp-stats--right {
	text-align: right;
}

/* Adds padding to left so it doesn't sit right up against page edge */
.cp-stats.alignfull .cp-stats__stat--half,
.cp-stats.alignfull .cp-stats__stat--third {
	padding: 0 10px;
}

.cp-stats__stat--large,
.cp-stats__stat--medium,
.cp-stats__stat--small {
	position: relative;
	overflow: hidden;
}

/* Gradient to fade out text if too big */
.cp-stats__stat--large:after,
.cp-stats__stat--medium:after,
.cp-stats__stat--small:after {
	content: "";
	display: block;
	position: absolute;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	 -ms-user-select: none;
		 user-select: none;
	pointer-events: none;
	background: linear-gradient(90deg,hsla(0,0%,100%,0),#fff 90%);
	top: 0;
	bottom: 0;
	right: 0;
	left: auto;
	width: 20%;
	height: auto;
}

/* Flip gradient for right aligned text */
.cp-stats--right .cp-stats__stat--large:after,
.cp-stats--right .cp-stats__stat--medium:after,
.cp-stats--right .cp-stats__stat--small:after {
	background: linear-gradient(-90deg,hsla(0,0%,100%,0),#fff 90%);
	right: auto;
	left: 0;
}

/*--------------------------------------------------------------
6.6.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-stats.alignwide .cp-stats__stat--full {
		padding: 0 4%;
	}

	/* Multi-Selector, Search: '.cp-stats.alignfull .cp-stats__stat--full' */
}

@media (min-width: 768px) {
	.cp-stats.alignwide .cp-stats__stat--full {
		padding: 0 12%;
	}

	/* Multi-Selector, Search: '.cp-stats.alignfull .cp-stats__stat--full' */
}

@media (min-width: 1120px) {
	.cp-stats.alignwide .cp-stats__stat--full {
		padding: 0 14%;
	}

	/* Multi-Selector, Search: '.cp-stats.alignfull .cp-stats__stat--full' */

	.hfeed .hentry .cp-stats.alignfull .cp-stats__stat--full {
		padding: 0 15%;
	}
}

/*--------------------------------------------------------------
6.6.2 Elements
--------------------------------------------------------------*/
/* Resets margin */
#content .cp-stats p,
#content .cp-stats.alignwide p,
#content .cp-stats.alignfull p {
	margin: 0;
}

.cp-stats__stat--full {
	border-top: 1px solid #eee;
}

.cp-stats__stat--full:first-child {
	border-top: 0;
}

/* Although this is the big text, as its a modified span suppose technically its an element */
.cp-stats__span--big-text {
	display: block;
	font-weight: 700;
	position: relative;
	white-space: nowrap;
}

/* Although this is the small text, as its a modified span suppose technically its an element */
.cp-stats__span--small-text {
	display: block;
	position: relative;
	padding: 5px 22px 0 22px;
	margin: 10px 0;
}

/* Multi-Selector, Search: '.cp-stats__span--small-text:before' */

.cp-stats.alignfull .cp-stats__stat--half .cp-stats__span--small-text:after,
.cp-stats.alignfull .cp-stats__stat--third .cp-stats__span--small-text:after {
	content: '';
	position: absolute;
	top: 0;
	left: -10px;
	height: 100%;
	width: 1px;
	background: #eee;
}

/* Helps make sure that text that is different size aligns */
.cp-stats__span--vertical-align-helper {
	line-height: .7;
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
}

/*--------------------------------------------------------------
6.6.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-stats__stat--half {
		width: 49%;
		float: left;
		margin-right: 2%;
	}

	.cp-stats__stat--third {
		width: 33%;
		float: left;
		margin-right: .5%;
	}

	.cp-stats__stat--last {
		margin: 0;
	}
}

/*--------------------------------------------------------------
6.6.2.2 Big Text Sizes (there's quite a lot of them)
--------------------------------------------------------------*/
.cp-stats__stat--large .cp-stats__span--big-text {
	font-size: 7em;
	height: 105px;
}

.cp-stats__stat--medium .cp-stats__span--big-text {
	font-size: 5em;
	height: 90px;
}

.cp-stats__stat--small .cp-stats__span--big-text {
	font-size: 3em;
	height: 50px;
}

/*--------------------------------------------------------------
6.6.2.2.1 Three Per Row
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.1.1 Standard
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.1.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats__span--big-text {
		height: 77px;
	}

	.cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.8em;
	}

	.cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.2em;
	}

	.cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 1.75em;
	}
}

@media (min-width: 768px) {
	#content .cp-stats__span--big-text {
		height: 77px;
	}

	.cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 3.3em;
	}

	.cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.6em;
	}

	.cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.2em;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats__span--big-text {
		height: 77px;
	}

	.cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 4.5em;
	}

	.cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 3.5em;
	}

	.cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.8em;
	}
}

/*--------------------------------------------------------------
6.6.2.2.1.2 Wide
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.1.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats.alignwide .cp-stats__stat--third .cp-stats__span--big-text {
		height: 68px;
	}

	.cp-stats.alignwide .cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 3.8em;
	}

	.cp-stats.alignwide .cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.8em;
	}

	.cp-stats.alignwide .cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2em;
	}
}

@media (min-width: 768px) {
	#content .cp-stats.alignwide .cp-stats__stat--third .cp-stats__span--big-text {
		height: 105px;
	}

	.cp-stats.alignwide .cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 5.4em;
	}

	.cp-stats.alignwide .cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 3.6em;
	}

	.cp-stats.alignwide .cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.8em;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats.alignwide .cp-stats__stat--third .cp-stats__span--big-text {
		height: 112px;
	}

	.cp-stats.alignwide .cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 6.7em;
	}

	.cp-stats.alignwide .cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 5em;
	}

	.cp-stats.alignwide .cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 3.9em;
	}
}

/*--------------------------------------------------------------
6.6.2.2.1.3 Full Width
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.1.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats.alignfull .cp-stats__stat--third .cp-stats__span--big-text {
		height: 90px;
	}

	.cp-stats.alignfull .cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 4.2em;
	}

	.cp-stats.alignfull .cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 3.2em;
	}

	.cp-stats.alignfull .cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2em;
	}
}

@media (min-width: 768px) {
	#content .cp-stats.alignfull .cp-stats__stat--third .cp-stats__span--big-text {
		height: 100px;
	}

	.cp-stats.alignfull .cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 6em;
	}

	.cp-stats.alignfull .cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 4em;
	}

	.cp-stats.alignfull .cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 2.2em;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats.alignfull .cp-stats__stat--third .cp-stats__span--big-text {
		height: 135px;
	}

	.cp-stats.alignfull .cp-stats__stat--large.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 8.7em;
	}

	.cp-stats.alignfull .cp-stats__stat--medium.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 6.2em;
	}

	.cp-stats.alignfull .cp-stats__stat--small.cp-stats__stat--third .cp-stats__span--big-text {
		font-size: 4.8em;
	}
}

/*--------------------------------------------------------------
6.6.2.2.2 Two Per Row
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.2.1 Standard
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.2.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats__stat--half .cp-stats__span--big-text {
		height: 60px;
	}

	.cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 3.6em;
	}

	.cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 2.1em;
	}

	.cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 1.4em;
	}
}

@media (min-width: 768px) {
	#content .cp-stats__stat--half .cp-stats__span--big-text {
		height: 92px;
	}

	.cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 5.3em;
	}

	.cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 3.3em;
	}

	.cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 1.8em;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats__stat--half .cp-stats__span--big-text {
		height: 121px;
	}

	.cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 7.3em;
	}

	.cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 5.3em;
	}

	.cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 3.3em;
	}
}

/*--------------------------------------------------------------
6.6.2.2.2.2 Wide
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.2.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats.alignwide .cp-stats__stat--half .cp-stats__span--big-text {
		height: 90px;
	}

	.cp-stats.alignwide .cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 5.3em;
	}

	.cp-stats.alignwide .cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 3.3em;
	}

	.cp-stats.alignwide .cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 1.8em;
	}
}

@media (min-width: 768px) {
	#content .cp-stats.alignwide .cp-stats__stat--half .cp-stats__span--big-text {
		height: 102px;
	}

	.cp-stats.alignwide .cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 7.3em;
	}

	.cp-stats.alignwide .cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 5.3em;
	}

	.cp-stats.alignwide .cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 3.3em;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats.alignwide .cp-stats__stat--half .cp-stats__span--big-text {
		height: 141px;
	}

	.cp-stats.alignwide .cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 9.3em;
	}

	.cp-stats.alignwide .cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 7.3em;
	}

	.cp-stats.alignwide .cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 5.3em;
	}
}

/*--------------------------------------------------------------
6.6.2.2.2.3 Full Width
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.2.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats.alignfull .cp-stats__stat--half .cp-stats__span--big-text {
		height: 100px;
	}

	.cp-stats.alignfull .cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 7.5em;
	}

	.cp-stats.alignfull .cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 4.5em;
	}

	.cp-stats.alignfull .cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 1.8em;
	}
}

@media (min-width: 768px) {
	#content .cp-stats.alignfull .cp-stats__stat--half .cp-stats__span--big-text {
		height: 138px;
	}

	.cp-stats.alignfull .cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 10.5em;
	}

	.cp-stats.alignfull .cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 7.5em;
	}

	.cp-stats.alignfull .cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 4.5em;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats.alignfull .cp-stats__stat--half .cp-stats__span--big-text {
		height: 193px;
	}

	.cp-stats.alignfull .cp-stats__stat--large.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 13.5em;
	}

	.cp-stats.alignfull .cp-stats__stat--medium.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 11.5em;
	}

	.cp-stats.alignfull .cp-stats__stat--small.cp-stats__stat--half .cp-stats__span--big-text {
		font-size: 9.5em;
	}
}

/*--------------------------------------------------------------
6.6.2.2.3 One Per Row
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.6.2.2.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-stats__stat--large.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 9em;
		height: 140px;
	}

	#content .cp-stats__stat--medium.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 7em;
		height: 120px;
	}

	#content .cp-stats__stat--small.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 5em;
		height: 70px;
	}
}

@media (min-width: 768px) {
	#content .cp-stats__stat--large.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 12em;
		height: 160px;
	}

	#content .cp-stats__stat--medium.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 9em;
		height: 140px;
	}

	#content .cp-stats__stat--small.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 7em;
		height: 90px;
	}
}

@media (min-width: 1120px) {
	#content .cp-stats__stat--large.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 14em;
		height: 188px;
	}

	#content .cp-stats__stat--medium.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 11em;
		height: 158px;
	}

	#content .cp-stats__stat--small.cp-stats__stat--full .cp-stats__span--big-text {
		font-size: 8em;
		height: 112px;
	}
}

/*--------------------------------------------------------------
6.7 Alert
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.7.1 Blocks
--------------------------------------------------------------*/
.cp-alert {
	position: relative;
	background-color: #005c46;
	color: #fff;
}

.cp-alert:before,
.cp-alert:after {
	position: absolute;
	content: "";
	width: 100%;
	height: 10px;
	background-color: inherit;
	top: -5px;
	transform: rotate(-.5deg)
}

.cp-alert:after {
	top: auto;
	bottom: -5px;
	transform: rotate(-.2deg)
}

.cp-alert.alignfull:before,
.cp-alert.alignfull:after {
	content: none;
}

.cp-alert__content-wrapper {
	position: relative;
	padding: 25px 25px 25px 62px;
}

/* Multi-Selector, Search: '.alignfull .cp-alert__content-wrapper' */

.cp-alert__content-wrapper:before {
	left: 15px;
	background-position: -17px -214px;
}

/* Multi-Selector, Search: '.cp-alert__content-wrapper:before' */

.cp-alert__content-wrapper:after {
	content: '';
	position: absolute;
	right: -9px;
	width: 10px;
	height: 120%;
	background-color: #ffffff;
	top: -12%;
	z-index: 99;
}

.alignfull .cp-alert__content-wrapper:after {
	content: none;
}

.alignfull .cp-alert__content-wrapper {
	padding: 25px 25px 25px 46px;
}

.alignfull .cp-alert__content-wrapper:before {
	left: 0;
}

/*--------------------------------------------------------------
6.7.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.cp-alert__content-wrapper {
		padding: 25px 25px 25px 78px;
	}

	.alignfull .cp-alert__content-wrapper {
		padding: 25px 25px 25px 60px;
	}

	.cp-alert__content-wrapper:before {
		left: 20px;
		background-position: center -263px;
	}
}

/*--------------------------------------------------------------
6.7.2 Elements
--------------------------------------------------------------*/
/* Reset paragraph margin */
#content .p--cp-alert__message {
	margin: 0;
}

#content .p--cp-alert__link-wrapper {
	position: absolute;
	margin: 7px 0 0 0;
	right: 0;
	font-size: .75em;
	width: 115px;
	text-align: center;
	z-index: 100;
}

#content .p--cp-alert__link-wrapper:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

/*--------------------------------------------------------------
6.7.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	#content .p--cp-alert__link-wrapper {
		width: 25%;
		height: 100%;
		top: 0;
		border-left: 2px solid rgba(0, 0, 0, 0.2);
		margin: 0;
		font-size: 1em;
	}

	#content .alignfull .p--cp-alert__link-wrapper {
		background: rgba(0, 0, 0, 0.2);
		border: none
	}

	#content .cp-alert--with-link .p--cp-alert__message {
		width: 67%;
	}
}

/*--------------------------------------------------------------
6.7.3 Links
--------------------------------------------------------------*/
.a--cp-alert {
	width: 100%;
	vertical-align: middle;
	font-size: .7em;
	padding: 10px;
	line-height: 1.55em;
	position: relative;
	z-index: 1;
}

/* Multi-Selector, Search: '.a--cp-alert' */

/*--------------------------------------------------------------
6.7.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.a--cp-alert {
		width: 80%;
		box-shadow: none;
	}
}

/*--------------------------------------------------------------
6.8 Display Forms (also includes cf7 styles)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.8.1 Typography
--------------------------------------------------------------*/
#content .cp-form__heading-big {
	margin: 0 0 18px 10px;
	font-size: 1.5em;
	text-transform: lowercase;

}

#content .cp-form__heading-small {
	margin: 0;
	font-size: .8em;
	text-transform: lowercase;
}

/*--------------------------------------------------------------
6.8.2 Blocks
--------------------------------------------------------------*/
.cp-form {
	padding: 3em 0;
	overflow: hidden;
	background-color: #4a4a4a;
	color: #fff;
	clear: both;
}

/* class added if background colour of form container is white */
.cp-form--no-padding {
	padding: 0;
}

div.wpcf7 {
	overflow: hidden;
}

.wpcf7-display-none {
	display: none;
}

div.wpcf7-response-output {
	background: #fff;
	margin: 0;
	font-style: italic;
	position: relative;
	font-size: .8em;
	padding: 20px 20px 20px 70px;
	border-color: #494949;
	color: #494949;
	clear: both;

}

.wpcf7-response-output:before {
	background-position: center -369px;
	background-color: #494949;
	width: 35px;
	height: 35px;
	left: 20px;
	clear: both;
}

/* Multi-Selector, Search: '.wpcf7-response-output:before' */

div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
	color: #f00;
}

div.wpcf7-validation-errors:before,
div.wpcf7-acceptance-missing:before {
	background-color: #f00;
}

div.wpcf7-mail-sent-ok {
	color: #398f14;
}

div.wpcf7-mail-sent-ok:before {
	background-color: #398f14;
	background-position: center -319px;
}

/*--------------------------------------------------------------
6.8.3 Elements
--------------------------------------------------------------*/
/* CF7 ajax loader */
.cp-form span.ajax-loader {
	position: absolute;
	top: 0;
	right: 5px;
	bottom: 0;
	margin: auto;
	width: 45px;
	height: 45px;
	background-image: url(assets/img/forms/cp-ajax-loader.svg);
	background-repeat: no-repeat;
	background-position: center;
	pointer-events: none;
}

span.wpcf7-list-item {
	display: block;
	width: 100%;
	margin: 0;
	padding: 25px 20px;
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
	background: #fff;
}

span.wpcf7-list-item.has-free-text {
	margin-top: 10px;
	box-shadow: none;
	background: none;
	padding-top: 10px;
}

/* message that appears below field if error (e.g. field not filled in) */
span.wpcf7-not-valid-tip {
	padding: 10px 10px 10px 37px;
	font-size: .65em;
	background: #f00;
	position: relative;
	font-style: italic;
	color: #fff;
	margin-top: -2px;
	border-right: 2px solid #494949;
	border-bottom: 2px solid #494949;
	border-left: 2px solid #494949;
}

span.wpcf7-not-valid-tip:before {
	background-color: #f00;
	background-position: center -192px;
	width: 20px;
	height: 20px;
	top: 10px;
	bottom: auto;
	left: 10px;
}

/* Multi-Selector, Search: 'span.wpcf7-not-valid-tip:before' */

/*--------------------------------------------------------------
6.8.4 Forms
--------------------------------------------------------------*/
/* If user chooses option to hide labels then all labels with this class will be hidden */
label.cp-if-hide {
	position: absolute;
	margin-top: -18px;
	font-size: .75em;
	font-style: italic;
}

.cp-form--hide-labels label.cp-if-hide {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

/*--------------------------------------------------------------
6.9 Donations
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.9.1 Typography
--------------------------------------------------------------*/
/* reset p margin */
#content .cp-donations p {
	margin: 0 0 5px;
	font-size: inherit;
}

#content p.cp-donations__p--title {
	font-size: 2em;
	line-height: 1.2em;
	font-weight: 700;
	margin-bottom: 0;
}

#content .cp-donations .cp-donations__p--description {
	margin-top: 1.5em;
}

#content .cp-alert--required p {
	margin-bottom: 0;
}

/*--------------------------------------------------------------
6.9.2 Blocks
--------------------------------------------------------------*/
/* Multi-Selector, Search: '.cp-donations' */

.cp-donations__column-cards > div, /* Donation cards (need to tidy up class names) */
.cp-donations--cards > .cp-donations__column-full,
.cp-donations--block,
.cp-donations--quick {
	position: relative;
	padding: 30px;
	margin-bottom: 1.5em;
}

.cp-donations__column-cards,
.cp-donations__column-cards > div,
.cp-donations--cards > .cp-donations__column-full,
.cp-donations--block {
	overflow: hidden;
}

.cp-donations--block,
.cp-donations--quick {
	clear: both;
}

.cp-donations--quick {
	background-color: rgba(242, 242, 242, 0.6784313725490196);
}

/* Multi-Selector, Search: '.cp-donations__column-cards > div:before' */

/* Multi-Selector, Search: '.cp-donations--cards > .cp-donations__column-full' */

/* Multi-Selector, Search: '.cp-donations--block:before' */

/* Multi-Selector, Search: '.cp-donations--quick:before' */
/* Multi-Selector, Search: '.cp-donations--quick:after' */

.cp-donations__column-cards > .cp-donations__column-img {
	padding-top: 205px;
}

/* div that displays the background image (guess this could prob go in 'media' but as its a div, putting it in 'blocks') */
.cp-donations__img {
	background-size: cover;
	background-repeat: no-repeat;
	height: 175px;
	width: 95%;
	position: absolute;
	top: 5px;
	left: 0;
	background-position: center;
	border-bottom: 4px solid #d7d7d9;
	margin: auto;
	left: 0;
	right: 0;
}

/* These are hidden on page load, and displayed via js as and when required */
.cp-donations__check-one,
.cp-donations__check-two,
.cp-donations__check-one-and-two {
	display: none;
}

.cp-donations--quick__pop-up {
	position: relative;
	display: block
}

.cp-donations--quick__pop-up[data-align=none] {
	display: none;
}

/* any amount */
.cp-donations--quick__pop-up[data-align=full] {
	right: 0;
	width: 33%;
	float: right;
}

/* one block */
.cp-donations--1 .cp-donations--quick__pop-up[data-align=pop-up-1] {
	width: 100%;
}

/* two blocks - 1 */
.cp-donations--2 .cp-donations--quick__pop-up[data-align=pop-up-1] {
	width: 49%;
	float: left;
}

/* two blocks - 2 */
.cp-donations--2 .cp-donations--quick__pop-up[data-align=pop-up-2] {
	width: 49%;
	float: right;
}

/* three blocks - 1 */
.cp-donations--3 .cp-donations--quick__pop-up[data-align=pop-up-1] {
	width: 32%;
	float: left;
}

/* three blocks - 2 */
.cp-donations--3 .cp-donations--quick__pop-up[data-align=pop-up-2] {
	width: 32%;
	margin-left: 34%;
	float: left;
}

/* three blocks - 3 */
.cp-donations--3 .cp-donations--quick__pop-up[data-align=pop-up-3] {
	width: 32%;
	float: right;
}

/* four blocks - 1 */
.cp-donations--4 .cp-donations--quick__pop-up[data-align=pop-up-1] {
	width: 23.5%;
	float: left;
}

/* four blocks - 2 */
.cp-donations--4 .cp-donations--quick__pop-up[data-align=pop-up-2] {
	width: 23.5%;
	margin-left: 25.5%;
	float: left;
}

/* four blocks - 3 */
.cp-donations--4 .cp-donations--quick__pop-up[data-align=pop-up-3] {
	width: 23.5%;
	float: right;
	margin-right: 25.5%;
}

/* four blocks - 4 */
.cp-donations--4 .cp-donations--quick__pop-up[data-align=pop-up-4] {
	width: 23.5%;
	float: right;
}

/* five blocks - 1 */
.cp-donations--5 .cp-donations--quick__pop-up[data-align=pop-up-1] {
	width: 18.5%;
	float: left;
}

/* five blocks - 2 */
.cp-donations--5 .cp-donations--quick__pop-up[data-align=pop-up-2] {
	width: 18.5%;
	margin-left: 20.5%;
	float: left;
}

/* five blocks - 3 */
.cp-donations--5 .cp-donations--quick__pop-up[data-align=pop-up-3] {
	width: 18.5%;
	float: left;
	margin-left: 40.5%;
}

/* five blocks - 4 */
.cp-donations--5 .cp-donations--quick__pop-up[data-align=pop-up-4] {
	width: 18.5%;
	float: right;
	margin-right: 20.5%;
}

/* five blocks - 5 */
.cp-donations--5 .cp-donations--quick__pop-up[data-align=pop-up-5] {
	width: 18.5%;
	float: right;
}

#content .cp-donations--quick__pop-up .cp-donations--quick__pop-up__container {
	position: absolute;
	width: 145px;
	display: inline-block;
	padding: 20px;
	margin: auto;
	width: 180px;
	position: absolute;
	bottom: 72px;
	left: -9999px;
	right: -9999px;
	z-index: 99;
}

/* Multi-Selector, Search: '#content .cp-donations--quick__pop-up .cp-donations--quick__pop-up__container:before' */

#content .cp-donations--quick__pop-up .cp-donations--quick__pop-up__container:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-left: 14px solid transparent;
	border-right: 14px solid transparent;
	border-top: 15px solid #ffffff;
	bottom: -15px;
	margin: auto;
	left: 0;
	right: 0;
}

/* Error message */
.cp-alert--required {
	position: relative;
	color: #f00;
	padding: 10px;
	font-size: .7em;
	border: 2px solid #f00;
	font-weight: 700;
	margin: 6px 0 0 -5px;
	display: none;
	z-index: 1;
}

/* Error message arrow */
.cp-alert--required:before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 7px solid #f00;
	top: -8px;
	left: 3px;
}

/* container for checkboxes */
.cp-donations__checkboxes {
	width: 100%;
	float: left;
	margin: 2% 0;
	overflow: hidden;
}

.cp-donations--quick__pop-up__container .cp-donations__checkboxes {
	margin: 0;
}

/*--------------------------------------------------------------
6.9.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-donations__column-half {
		width: 49%;
		float: left;
		margin-right: 2%;
	}

	.cp-donations__column-third {
		width: 32%;
		float: left;
		margin-right: 2%;
	}

	.cp-donations__column-last {
		margin: 0;
	}
}

@media (min-width: 768px) {
	.cp-donations {
		font-size: .85em;
	}
}

/*--------------------------------------------------------------
6.9.3 Elements
--------------------------------------------------------------*/
span.cp-donations--block__any-amount-currency-symbol,
span.cp-donations--quick__any-amount-currency-symbol {
	width: 4%;
	float: left;
	text-align: center;
	margin-top: 12px;
}

span.cp-donations--cards__any-amount-currency-symbol {
	float: left;
	width: 10%;
	background: #eee;
	height: 58px;
	text-align: center;
	padding-top: 14px;
	margin-right: 1%;
}

/*--------------------------------------------------------------
6.9.4 Forms
--------------------------------------------------------------*/
/* reset form margin */
#content .cp-donations form {
	margin: 0;
}

/* Donate btn and placeholder btn for cards */
.cp-donations .cp-donate,
.cp-donations .cp-donate-placeholder {
	width: 100%;
	display: block;
}

/* Donate btn and placeholder btn for cards and pop-up */
.cp-donations__column-cards .cp-donate,
.cp-donations__column-cards .cp-donate-placeholder,
.cp-donations--quick__pop-up__container .cp-donate,
.cp-donations--quick__pop-up__container .cp-donate-placeholder {
	padding: 15px 25px;
	word-break: break-word;
	font-size: .85em;
	width: auto;
}

.cp-donations--quick__pop-up__container .cp-donate,
.cp-donations--quick__pop-up__container .cp-donate-placeholder {
	display: block;
	width: 100%;
}

/* Submit button hidden until required checkbox is ticked */
.cp-donations__column-required .cp-donate,
.cp-donations--required .cp-donate {
	display: none;
}

/* Donation button that is selected (used for 'block' and 'quick' donation types */
.cp-donations button.selected {
	box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1), 0 0 0 5px #cccccc;
}

/**
 * Wrapper divs for checkboxes (and labels), although divs, as they are only
 * wrappers for donation form elements putting them in the 'forms' section
 */
.cp-donations__checkboxes__check-one,
.cp-donations__checkboxes__check-two {
	font-size: .8em;
}

.cp-donations__checkboxes--2 .cp-donations__checkboxes__check-one {
	margin-bottom: 5px;
}

.cp-donations__req--cards label,
.cp-donations__req--block label,
.cp-donations__req--quick label {
	font-size: .7em;
	font-style: italic;
}

.cp-donations--cards .cp-donations__checkboxes div > input,
.cp-donations--quick .cp-donations__checkboxes div > input {
	position: absolute;
	margin-top: 3px;
}

.cp-donations--block .cp-donations__checkboxes div > input {
	position: absolute;
	margin: 19px 0 0 15px;
}

/* Moves Uniform input to replicate bare styles above */
.cp-donations--cards .cp-donations__checkboxes div.checker,
.cp-donations--quick__pop-up .cp-donations__checkboxes div.checker {
	position: absolute;
	margin-top: 1px;
}

.cp-donations--block .cp-donations__checkboxes div.checker {
	position: absolute;
	margin: 16px 0 0 9px;
}

.cp-donations__req--cards > input,
.cp-donations__req--block > input,
.cp-donations__req--quick > input {
	position: absolute;
	margin-top: 1px;
}

.cp-donations__req--block > input {
	margin-top: 10px;
}

/* Moves Uniform input to replicate bare styles above */
.cp-donations__req--cards > div.checker,
.cp-donations__req--block > div.checker,
.cp-donations__req--quick > div.checker {
	position: absolute;
	margin-top: 7px;
}

.cp-donations__checkboxes__check-one > label,
.cp-donations__checkboxes__check-two > label {
	display: block;
	line-height: 1.7em;
	padding: 0 0 9px 25px;
	cursor: pointer;
}

.cp-donations--block .cp-donations__checkboxes__check-one > label,
.cp-donations--block .cp-donations__checkboxes__check-two > label {
	background: #eee;
	padding: 15px 20px 15px 35px;
}

.cp-donations__req--cards > label,
.cp-donations__req--block > label,
.cp-donations__req--quick > label {
	display: block;
	padding-top: 7px;
	padding-left: 19px;
}

/* Slightly more padding-right with uniform as checkbox slightly bigger */
.cp-donations__req--cards > .checker + label,
.cp-donations__req--block > .checker + label,
.cp-donations__req--quick > .checker + label {
	padding-left: 25px;
}

.js-cp-donations--block__amount,
.js-cp-donations--quick__amount {
	padding: 17px 0;
}

/* adds a margin-bottom to all top row fixed amount buttons in the 'block' layout */
.cp-donations--block .js-cp-donations--block__amount {
	margin-bottom: 2%;
}

.cp-donations--1 .js-cp-donations--block__amount,
.cp-donations--1 .js-cp-donations--quick__amount {
	width: 100%;

}

.cp-donations--2 .js-cp-donations--block__amount,
.cp-donations--2 .js-cp-donations--quick__amount {
	width: 49%;
	margin-left: 2%;
	float: left;

}

.cp-donations--4.cp-donations--block--any-amount .js-cp-donations--block__amount,
.cp-donations--3 .js-cp-donations--block__amount,
.cp-donations--3 .js-cp-donations--quick__amount {
	width: 32%;
	margin-left: 2%;
	float: left;

}

.cp-donations--6.cp-donations--block--any-amount .js-cp-donations--block__amount,
.cp-donations--4 .js-cp-donations--block__amount,
.cp-donations--4 .js-cp-donations--quick__amount {
	width: 23.5%;
	margin-left: 2%;
	float: left;

}

.cp-donations--5 .js-cp-donations--block__amount,
.cp-donations--5 .js-cp-donations--quick__amount {
	width: 18.4%;
	margin-left: 2%;
	float: left;
}

.cp-donations--6 .js-cp-donations--block__amount,
.cp-donations--6 .js-cp-donations--quick__amount {
	width: 15.5%;
	margin-left: 1.4%;
	float: left;
}

.cp-donations--1.cp-donations--block--any-amount .js-cp-donations--block__amount {
	width: 32%;
	float: left;
}

.cp-donations--0.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount {
	width: 96%;
}

.cp-donations--1.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount,
.cp-donations--4.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount {
	width: 64%;
	float: right;
}

/* 5 fixed amounts with any amount */
.cp-donations--2.cp-donations--block--any-amount .js-cp-donations--block__amount,
.cp-donations--5.cp-donations--block--any-amount .js-cp-donations--block__amount {
	width: 23.5%;
	margin-left: 2%;
	float: left;
}

.cp-donations--3.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount {
	width: 96%;
	float: right;
}

.cp-donations--2.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount,
.cp-donations--6.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount {
	width: 47%;
	float: left;
}

.cp-donations--5.cp-donations--block--any-amount .js-cp-donations--block__input--any-amount {
	width: 72.5%;
	float: left;
}

.cp-donations--4.cp-donations--block--any-amount button + input + button + input + button + input + .js-cp-donations--block__amount,
.cp-donations--5.cp-donations--block--any-amount button + input + button + input + button + input + button + input + .js-cp-donations--block__amount,
.cp-donations--6.cp-donations--block--any-amount button + input + button + input + button + input + button + input + .js-cp-donations--block__amount,
.cp-donations .js-cp-donations--block__amount:first-child,
.cp-donations .js-cp-donations--quick__amount:first-child {
	margin: 0;
}

.cp-donations--6.cp-donations--block--any-amount button + input + button + input + button + input + button + input + button + input + .js-cp-donations--block__amount {
	margin-left: 2%;
}

.cp-donations--quick .js-cp-donations--quick__input--any-amount {
	width: 61%;
	float: left;
	height: 53px;
}

.cp-donations--quick .js-cp-donations--quick__any-amount {
	width: 33%;
	float: right;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	height: 53px;
	padding: 0;
}

/*--------------------------------------------------------------
6.9.4.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-donations__checkboxes--2 .cp-donations__checkboxes__check-one {
		float: left;
		width: 49%;
		margin-bottom: 0;
	}

	.cp-donations__checkboxes--2 .cp-donations__checkboxes__check-two {
		float: right;
		width: 49%;
	}

	.cp-donations__checkboxes--2 .cp-donations__checkboxes__check-one > label,
	.cp-donations__checkboxes--2 .cp-donations__checkboxes__check-two > label {
		margin-bottom: -985px;
		padding-bottom: 1000px;
	}
}

/*--------------------------------------------------------------
6.9.5 Stripe Payments (WP Plugin)
--------------------------------------------------------------*/
.cp-donations--block .asp_product_item_amount_input_container input.asp_product_item_amount_input,
.cp-donations--quick .asp_product_item_amount_input_container input.asp_product_item_amount_input,
.asp_product_item_amount_currency_label {
	display: none !important;
}

/* Error message that appears if no amount is input and user clicks the submit button */
.asp_product_item_amount_currency_label + span {
	float: left;
	padding-bottom: 10px;
	font-size: .8em;
	color: #f00;
	font-size: .7em;
	font-weight: 700;
	background: #FFF;
	text-transform: uppercase;
	font-style: italic;
}

.cp-donations--cards .asp_product_item_amount_input {
    text-transform: capitalize;
    border-style: dashed;
	margin-bottom: 10px;
	float: left;
	width: 89%;
}

div.asp_product_buy_btn_container {
	width: 100%;
	display: block;
}

/*--------------------------------------------------------------
6.10 Section
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.10.1 Typography
--------------------------------------------------------------*/
#content .p--cp-section,
#content .heading--cp-section {
	color: #fff;
	font-weight: 700;
	margin: 0;
	font-size: 1.6em;
	line-height: 1.25em;
	display: inline-block;
	position: relative;
}

.cp-section__content-container--quote .p--cp-section:before,
.cp-section__content-container--quote .heading--cp-section:before {
	content: "\201C";
	font-size: 6em;
	position: absolute;
	top: 25px;
	left: -50px;
	opacity: .3;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#content h1.heading--cp-section {
	font-size: 2em;
}

/**
 * As 'the_content()' wraps 'a tags' in 'p tags' we put one in (and style it as needed).
 * Targeting with '#content' to overwrite default p.
 */
#content .p--cp-section--btn-wrapper {
	margin: 1em 0 0;
}

#content .p--cp-section--footer {
	margin: 1em 0 0;
	color: #fff;
	font-style: italic;
}

/*--------------------------------------------------------------
6.10.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.p--cp-section,
	#content .heading--cp-section {
		font-size: 1.85em;
	}

	#content h1.heading--cp-section {
		font-size: 2.2em;
	}
}

@media (min-width: 768px) {
	.p--cp-section,
	#content .heading--cp-section {
		font-size: 2.05em;
	}

	#content h1.heading--cp-section {
		font-size: 2.5em;
	}
}

@media (min-width: 1120px) {
	#content h1.heading--cp-section {
		font-size: 3em;
	}
}

/*--------------------------------------------------------------
6.10.2 Blocks
--------------------------------------------------------------*/
.cp-section {
	padding: 50px 6.5% 35px;
	position: relative;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #5796da;
}

/* Multi-Selector, Search: '.cp-section:after' */

/* Multi-Selector, Search: '.cp-section_opacity' */

.cp-section__img-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

/* Multi-Selector, Search: '.cp-section__img-overlay:after' */

.cp-section__img-overlay--hide-on-mobile {
	display: none;
}

.cp-section__content-container {
	position: relative;
	z-index: 1;
	color: #ffffff;
}

/*--------------------------------------------------------------
6.10.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-section {
		padding: 80px 10% 35px;
	}
}

@media (min-width: 768px) {
	.cp-section {
		padding: 130px 18% 45px;
	}

	.cp-section__img-overlay--hide-on-mobile {
		display: block;
	}
}

@media (min-width: 1120px) {
	.cp-section {
		padding: 200px 25% 80px;
	}

	.hfeed .hentry .cp-section {
		padding: 200px 15% 80px;
	}
}

/*--------------------------------------------------------------
6.10.3 Links
--------------------------------------------------------------*/
/* Multi-Selector, Search: 'a--cp-section' */

/*--------------------------------------------------------------
6.11 Show (Show Posts/Events/Campaigns)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.11.1 Typography
--------------------------------------------------------------*/
/* Resent margin */
#content .ul--cp-show-posts p {
	margin: 0;
}

/*--------------------------------------------------------------
6.11.2 Elements
--------------------------------------------------------------*/
.ul--cp-show-posts {
	list-style: none;
	padding: 0;
	font-size: .95em;
}

/* Multi-Selector, Search: '.ul--cp-show-posts:before' */
/* Multi-Selector, Search: '.ul--cp-show-posts:after' */

.ul--cp-show-posts__li {
	margin-bottom: 4%;
	overflow: hidden;
	position: relative;
	padding: 30px;
}

.ul--cp-show-posts__li:before {
	box-shadow: none;
	border: 5px solid #eaeaea;
}

/* Multi-Selector, Search: '.ul--cp-show-posts__li:before' */

/* 'tis a span, hence being in elements */
.ul--cp-show-posts__title {
	font-weight: 700;
	display: block;
	text-transform: uppercase;
	padding: 15px 0 10px;
}

/* 'tis a span, hence being in elements */
.ul--cp-show-posts__date {
	display: block;
	font-size: .8em;
	padding-bottom: 10px;
	color: #949494;
}

/* 'tis a span, hence being in elements */
.ul--cp-show-posts__desc {
	display: block;
	font-size: .9em;
	background: #ffffff;
	position: relative;
	z-index: 1;
	padding-bottom: 12px;
}

.ul--cp-show-posts__desc:after {
	content: "";
	display: block;
	width: 102%;
	height: 10px;
	background-color: inherit;
	position: absolute;
	left: -5px;
	z-index: -1;
	bottom: -5px;
	-webkit-transform: skewY(1deg);
		-ms-transform: skewY(1deg);
			transform: skewY(-1deg);
}

/*--------------------------------------------------------------
6.11.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.ul--cp-show-posts--half .ul--cp-show-posts__li {
		width: 48%;
		float: left
	}

	.ul--cp-show-posts--half .ul--cp-show-posts__li--half-last {
		float: right
	}
}

/*--------------------------------------------------------------
6.11.3 Links
--------------------------------------------------------------*/
.ul--cp-show-posts__a {
	font-size: .85em;
	padding: 14px 40px 8px;
}

/* Multi-Selector, Search: '.ul--cp-show-posts__a' */

/*--------------------------------------------------------------
6.11.4 Media
--------------------------------------------------------------*/
.ul--cp-show-posts__img {
	height: 180px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #eee;
}

/*--------------------------------------------------------------
6.12 Big Text
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.12.1 Typography
--------------------------------------------------------------*/
/* reset margins */
#content .cp-big-text h1,
#content .cp-big-text h2,
#content .cp-big-text h3,
#content .cp-big-text h4,
#content .cp-big-text h5,
#content .cp-big-text h6,
#content .cp-big-text ul,
#content .cp-big-text ol {
	margin-left: 0;
	margin-right: 0;
}

#content .cp-big-text p {
	margin: 0;
}

.cp-big-text__heading {
	font-size: 1em;
	font-weight: normal;
}

/*--------------------------------------------------------------
6.12.2 Blocks
--------------------------------------------------------------*/
.cp-big-text {
	overflow: hidden;
}

/* Multi-Selector, Search: '.cp-big-text' */

.cp-big-text__col-full {
	border-left: 1px solid #eee;
	padding-left: 4%;
}

.cp-big-text__content {
	font-size: 1.35em;
}

/*--------------------------------------------------------------
6.12.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-big-text__content {
		font-size: 1.5em;
	}
}

@media (min-width: 768px) {
	.cp-big-text__content {
		font-size: 1.7em;
	}
}

@media (min-width: 1120px) {
	.cp-big-text__content {
		font-size: 2em;
	}
}

/*--------------------------------------------------------------
6.13 Grid
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.13.1 Typography
--------------------------------------------------------------*/
/* reset margins */
#content .cp-grid p {
	margin: 0;
}

#content .cp-grid .cp-grid__block__heading {
	font-size: 1.15em;
	margin: 0 0 1em;
	font-weight: 700;
}

#content .cp-grid__block__p--desc + .cp-grid__block__p--btn-wrapper {
	margin-top: 1em;
}

#content .cp-grid .cp-grid__block__p--share-wrapper {
	border-top: 2px solid;
	margin-top: 1em;
	padding-top: 5px;
	float: right;
}

/*--------------------------------------------------------------
6.13.2 Blocks
--------------------------------------------------------------*/
.cp-grid {
	overflow: hidden; /* clearing */
}

.cp-grid__block {
	position: relative;
	text-align: center;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #5796da
}

/* Multi-Selector, Search: '.cp-grid__block:after' */

.cp-grid__col-1 .cp-grid__block,
.cp-grid__block--s {
	height: 320px;
	line-height: 320px;
}

.cp-grid__block--m {
	height: 640px;
	line-height: 640px;
}

.cp-grid__block--l {
	height: 960px;
	line-height: 960px;
}

.cp-grid__block--xl {
	height: 1280px;
	line-height: 1280px;
}

.cp-grid__block--shadow {
	box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.26);
	z-index: 1;
}

.cp-grid__vertical-align-helper {
	position: relative;
	z-index: 1;
	line-height: 1.6em;
	vertical-align: middle;
	display: inline-block;
	width: 65%;
	color: #ffffff;
}

.cp-grid__opacity {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
}

/*--------------------------------------------------------------
6.13.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-grid__col-1 {
		width: 66.66%;
		float: left;
	}

	.cp-grid__col-2 {
		width: 33.33%;
		float: left;
	}

	.cp-grid__col-1 .cp-grid__block {
		width: 50%;
		float: left;
	}

	.cp-grid__col-1 .cp-grid__block--full {
		width: 100%;
	}
}

@media (min-width: 768px) {
	.cp-grid__col-1 .cp-grid__block,
	.cp-grid__block--s {
		height: 380px;
		line-height: 380px;
	}

	.cp-grid__block--m {
		height: 760px;
		line-height: 760px;
	}

	.cp-grid__block--l {
		height: 1140px;
		line-height: 1140px;
	}

	.cp-grid__block--xl {
		height: 1520px;
		line-height: 1520px;
	}
}

/*--------------------------------------------------------------
6.13.3 Elements
--------------------------------------------------------------*/
/* 'tis the de facto title of the share thingy */
.cp-grid__block__p--share-wrapper span {
	font-size: .7em;
	vertical-align: middle;
	display: block;
	margin-top: -20px;
	display: inline-block;
	margin-right: 10px;
	font-style: italic;
	text-transform: lowercase;
}

/*--------------------------------------------------------------
6.13.4 Links
--------------------------------------------------------------*/
.a--cp-grid {
	font-size: .7em;
	background: none;
	border: 2px solid;
	width: auto;
	padding: 10px 25px;
	color: #fff;
}

/* Multi-Selector, Search: '.a--cp-grid' */

.a--cp-grid--fb,
.a--cp-grid--twitter {
	display: inline-block;
	overflow: hidden;
	text-indent: -99999px;
	border: 2px solid #fff;
}

.a--cp-grid--twitter {
	margin-left: 5px;
}

/* Multi-Selector, Search: '.a--cp-grid--fb' */
/* Multi-Selector, Search: '.a--cp-grid--twitter' */

/*--------------------------------------------------------------
6.14 Action
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.14.1 Typography
--------------------------------------------------------------*/
#content .cp-action__heading {
	font-size: 2em;
	line-height: 1.2em;
	display: inline-block;
	background: #eeeeee;
	margin-top: 0.67em;
	margin-bottom: 0;
	position: relative;
	z-index: 1;
	font-weight: 700;
}

#content .p--cp-action-sub-heading {
	position: relative;
	background: #3399cc;
	font-size: 1.2em;
	line-height: 1.55em;
	font-weight: 700;
	margin-top: 4px;
	z-index: 0;
}

#content .cp-action__heading + .cp-action__content .p--cp-action-sub-heading {
	margin-top: 35px;
}

.cp-action__heading:before,
.p--cp-action-sub-heading:before {
	content: '';
	background-color: inherit;
	width: 110%;
	height: 110%;
	position: absolute;
	z-index: -1;
	margin: -1% 0 0 -10%;
	transform: rotate(-1deg);
	left: 5%;
}

.p--cp-action-sub-heading:after {
	content: '';
	top: -9px;
	left: 0;
	background-color: #fff;
	height: 15px;
	z-index: 1;
	margin-top: -9px;
	width: 115%;
	transform: rotate(.3deg);
	position: absolute;
}

/*--------------------------------------------------------------
6.14.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	#content .cp-action__heading {
		font-size: 2.2em;
	}

	.cp-action__heading:before,
	.p--cp-action-sub-heading:before {
		width: 120%;
		left: 0;
	}
}

@media (min-width: 768px) {
	#content .cp-action__heading {
		font-size: 2.5em;
	}

	#content .cp-action__heading + .cp-action__content .p--cp-action-sub-heading {
		margin-top: 50px;
	}
}

@media (min-width: 1120px) {
	#content .cp-action__heading {
		font-size: 3em;
		margin-bottom: 0;
	}

	.hfeed #content .hentry .cp-action__heading,
	.hfeed #content .hentry .cp-action__content p {
		margin-left: 15%;
		margin-right: 15%;
	}
}

/*--------------------------------------------------------------
6.14.2 Blocks
--------------------------------------------------------------*/
.cp-action {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	padding-top: 50px;
	text-align: center;
	position: relative;
	overflow: hidden;
	background-color: #5796da;
	margin-bottom: 0;
}

/* class added if user doesn't have a heading */
.cp-action--no-padding {
	padding: 0;
}

/* Multi-Selector, Search: '.cp-action:after' */

/* Multi-Selector, Search: '.cp-action__opacity' */

.cp-action__content {
	text-align: left;
	position: relative;
	overflow: hidden;
	z-index: 1;
	padding: 0 10%;
}

.cp-action__content:before,
.cp-action__content:after {
	content: '';
	position: absolute;
	width: 95%;
	height: 100%;
	background-color: #fff;
	margin: auto;
	right: 0;
	left: 0;
	z-index: -1;
	transform: rotate(-1.5deg);
}

.cp-action__content:after {
	width: 105%;
	z-index: -1;
	height: 150px;
	bottom: -20px;
	transform: rotate(-1deg);
	left: -2.5%;
}

/*--------------------------------------------------------------
6.14.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-action__content {
		font-size: 1.1em;
	}
}

@media (min-width: 768px) {
	.cp-action__content {
		font-size: 1.3em;
	}

	.cp-action__content:before {
		width: 80%;
	}
}

@media (min-width: 1120px) {
	.cp-action h1,
	.cp-action h2,
	.cp-action h3,
	.cp-action h4,
	.cp-action h5,
	.cp-action h6 {
		font-size: 3em;
	}

	.cp-action__content {
		font-size: 1.5em;
	}

	.cp-action__content:before {
		width: 70%;
	}

	.hfeed .hentry .cp-action__content:before {
		width: 80%;
	}
}

/*--------------------------------------------------------------
6.15 Video
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.15.1 Typography
--------------------------------------------------------------*/
.cp-video__title {
	position: absolute;
	text-transform: none;
	width: 100%;
	display: block;
	bottom: 7%;
	left: 0;
	color: #fff;
	z-index: 1;
	padding: 0 7%;
	font-size: .85em;
}

#content .cp-video + .p--cp-video-description {
	font-size: .85em;
	font-style: italic;
	display: block;
	position: relative;
	padding: 5px 22px 0 22px;
}

/* Multi-Selector, Search: '.p--cp-video-description:before' */

/*--------------------------------------------------------------
6.15.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.alignwide .cp-video__title {
		padding: 0 8%;
		font-size: 1em;
	}
}

@media (min-width: 1120px) {
	.alignwide .cp-video__title {
		padding: 0 12%;
	}
}

/*--------------------------------------------------------------
6.15.2 Blocks
--------------------------------------------------------------*/
.cp-video {
	height: 100%;
	position: relative;
	padding-bottom: 48.9375%;
	overflow: hidden;
	z-index: 1;
}

#content div.cp-video--no-margin-bottom {
	margin-bottom: 0;
}

/**
 * Border and box shadow a bit too heavy when video follows section (as video
 * overlaps the section slightly) so this removes the box shadow and border.
 */
.section--cp-section + .cp-video:before {
	box-shadow: none;
	border: none;
}

/* Multi-Selector, Search: '.cp-video:before' */

/*--------------------------------------------------------------
6.15.2.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.cp-video {
		padding-bottom: 45%;
	}
}

@media (min-width: 768px) {
	.cp-video {
		padding-bottom: 36%;
	}

	.cp-video.alignwide {
		padding-bottom: 45%;
	}
}

@media (min-width: 1120px) {
	.cp-video {
		padding-bottom: 28.125%;
	}

	.cp-video.alignwide {
		padding-bottom: 39.375%;
	}
}

/*--------------------------------------------------------------
6.15.3 Elements
--------------------------------------------------------------*/
.cp-video__play-symbol {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-top: 15px solid transparent;
	border-bottom: 15px solid transparent;
	border-left: 20px solid #ffffff;
	z-index: 1;
}

.cp-video__play-symbol:before {
	height: 48px;
	width: 48px;
	background: rgba(255, 255, 255, 0.12941176470588237);
	left: -36px;
	bottom: -25px;
}

/* Multi-Selector, Search: '.cp-video__play-symbol:before' */

/* Multi-Selector, Search: '.cp-video__opacity' */

/*--------------------------------------------------------------
6.15.3.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	.cp-video__play-symbol {
		border-top: 25px solid transparent;
		border-bottom: 25px solid transparent;
		border-left: 40px solid #ffffff;
	}

	.cp-video__play-symbol:before {
		height: 65px;
		width: 65px;
		left: -54px;
		bottom: -32px;
	}
}

/*--------------------------------------------------------------
6.15.4 Links (inc Buttons)
--------------------------------------------------------------*/
button.cp-video__placeholder {
	width: 94%;
	height: 94%;
	border: 0;
	position: absolute;
	background-color: #5796da;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	text-align: left;
	font-weight: normal;
	background-size: cover;
	background-repeat: no-repeat;
}

/* Multi-Selector, Search: '.cp-video__placeholder:after' */

/*--------------------------------------------------------------
6.15.5 Media
--------------------------------------------------------------*/
.cp-video > iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 94%;
	height: 94%;
	margin: auto;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

/*--------------------------------------------------------------
6.16 Default Gutenberg Blocks/Modules (any that aren't styled
via any of the css above)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.16.1 Image and Gallery
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.16.1.1 Elements
--------------------------------------------------------------*/
/* Multi-Selector, Search: '.wp-block-image' */

/* Multi-Selector, Search: '.wp-block-image figcaption' */

/* Multi-Selector, Search: '.wp-block-image.alignfull figcaption' */

/*--------------------------------------------------------------
6.16.1.1.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 600px) {
	.wp-block-image.alignwide figcaption {
		margin: 0 4%;
	}
}

@media (min-width: 768px) {
	.wp-block-image.alignwide figcaption {
		margin: 0 12%;
	}
}

@media (min-width: 1120px) {
	.wp-block-image.alignwide figcaption {
		margin: 0 14%;
	}

	.hfeed .hentry .wp-block-image.alignwide figcaption {
		margin: 0 12%;
	}
}

/*--------------------------------------------------------------
6.16.2 Cover
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.16.2.1 Typography
--------------------------------------------------------------*/
#content .wp-block-cover-text {
	margin-bottom: 0;
	line-height: 1.45em;
}

/*--------------------------------------------------------------
6.16.3 Audio
--------------------------------------------------------------*/
/*--------------------------------------------------------------
6.16.3.1 Elements
--------------------------------------------------------------*/
.wp-block-audio figcaption {
	text-align: right;
	margin-bottom: -1px;
}

/*--------------------------------------------------------------
6.16.4 Button
--------------------------------------------------------------*/
/* Default button is rounded */
.wp-block-button__link {
	border-radius: 999px;
}

/* Multi-Selector, Search: '.wp-block-button .wp-block-button__link' */

/*--------------------------------------------------------------
6.16.5 Columns
--------------------------------------------------------------*/
/**
 * Good 'ol Gutenberg with its random margins dotted around the place...
 */
.wp-block-column {
	margin-bottom: 0;
}

/**
 * This has min width of 782px by default, which makes layout
 * look broken between 601px - 781px, hence this added
 * at 600px
 */
@media (min-width: 600px) {
	.wp-block-columns {
		flex-wrap: nowrap;
	}
}

/*--------------------------------------------------------------
6.16.6 Align Wide and Align Full
--------------------------------------------------------------*/
/**
 * Gutenberg alignfull class (for things that are full width)
 */
 #content .alignfull {
	margin-left: 0;
	margin-right: 0;
}

/*--------------------------------------------------------------
6.16.6.1 Responsive
--------------------------------------------------------------*/
@media (min-width: 768px) {
	#content .alignwide {
		margin: 0 10% 1.5em;
	}
}

@media (min-width: 1120px) {
	#content .alignwide {
		margin: 0 15% 1.5em;
	}

	.hfeed #content .hentry .alignwide {
		margin: 0 5% 1.5em;
	}
}

/*--------------------------------------------------------------
6.16.7 Align Right/Left
--------------------------------------------------------------*/
#content .alignleft,
#content .alignright {
	float: none;
	margin: 0;
}

/*--------------------------------------------------------------
6.17 Conditional Margins
--------------------------------------------------------------*/
.cp-hero + .cp-hero,
.cp-hero + .section--cp-section.alignfull,
.cp-hero + .cp-action,
.cp-hero + .cp-alert.alignfull,
.cp-hero + .cp-form,
.section--cp-section.alignfull + .section--cp-section.alignfull,
.section--cp-section.alignfull + .cp-hero,
.section--cp-section.alignfull + .cp-action,
.section--cp-section.alignfull + .cp-alert.alignfull,
.section--cp-section.alignfull + .cp-form,
.cp-alert.alignfull + .cp-hero,
.cp-alert.alignfull + .section--cp-section.alignfull,
.cp-alert.alignfull + .cp-action,
.cp-alert.alignfull + .cp-form,
.cp-form + .cp-hero,
.cp-form + .section--cp-section.alignfull,
.cp-form + .cp-action,
.cp-form + .cp-alert.alignfull,
.cp-accordion + .cp-accordion,
.cp-stats + .cp-stats {
	margin-top: -1.5em;
}

.cp-action + .cp-action {
	margin-top: -.85em;
}

#content .section--cp-section + .cp-video {
	margin-top: -3em;
}

/*--------------------------------------------------------------
7 Misc - for the stuff that doesn't quite fit anywhere else
--------------------------------------------------------------*/
/*--------------------------------------------------------------
7.1 No js message - displayed if js disabled
--------------------------------------------------------------*/
/*--------------------------------------------------------------
7.1.1 Typography
--------------------------------------------------------------*/
.p--cp-no-js-message {
	padding-left: 40px;
	background-image: url(assets/img/cp-no-js.png);
	background-image: linear-gradient(transparent,transparent),url(assets/img/cp-no-js.svg);
	background-repeat: no-repeat;
	font-size: .75em;
	background-position: 0;
}

.cp-donations--block .p--cp-no-js-message,
.cp-donations--quick .p--cp-no-js-message,
.cp-donations__column-full .p--cp-no-js-message {
	padding: 10px 10px 10px 40px;
}

/*--------------------------------------------------------------
7.1.2 Blocks
--------------------------------------------------------------*/
.cp-no-js-message {
	display: none;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0 14% 0 12%;
	vertical-align: middle;
	width: 100%;
}

.site-header__cta .cp-no-js-message {
	width: 98%;
	padding-right: 50px;
	padding-left: 50px;
}

.cp-donations .cp-no-js-message {
	background: #eee;
	padding: 12px;
	font-size: .85em;
}

/*--------------------------------------------------------------
7.1.3 Links
--------------------------------------------------------------*/
.cp-no-js-message a {
	font-style: italic;
	font-weight: 700;
}

/*--------------------------------------------------------------
7.2 Twitter embed thingy
--------------------------------------------------------------*/
.twitter-tweet {
	transform: rotate(-1.5deg) !important;
	box-shadow: 0 15px 50px rgba(50, 50, 93, 0), -5px 6px 15px rgba(0, 0, 0, 0.06);
	width: auto !important;
	max-width: 520px !important;
}

/* Multi-Selector, Search: '.twitter-tweet' */