/**
 * @file
 * Subtheme specific CSS.
 */

/* -- Handy CSS -- */

@media only screen and (max-width : 576px) { /* Mobile */
}
@media only screen and (min-width : 576px) and (max-width : 992px) { /* iPads */
}
@media only screen and (min-width : 992px) { /* Desktops */
}


/* -- Variables -- */

:root {

--near-black: #444444;
--near-white: #f4f4f4;

--color-1: #252A36; /* dark blue/slate updated 2021 */

--color-2: #F1EEE6; /* cream/off-white updated 2021 */

--color-3a: #00A499; /* teal */
--color-3b: #00857E; /* dark teal */

--color-4a: #E10600; /* red */
--color-4b: #AF231C; /* dark red */

--color-5a: #FFCD00; /* yellow/gold */
--color-5b: #FFAD00; /* light orange */

--color-6a: #8FC3D1; /* light blue */
--color-6b: #253597; /* dark blue */

--border-radius: 0.33em;

}

/* -- BEGIN Typography -- */

html {
	font-family: 'Source Sans Pro', sans-serif;
	letter-spacing: -0.01em;
}

h1, h2 {


}

h1 {
	font-family: 'Oswald', sans-serif;
	letter-spacing: -0.02em;
	color: var(--color-3b);
	text-transform: uppercase;
	font-weight: bold;
}

h2 {
	font-family: 'Oswald', sans-serif;
	letter-spacing: -0.02em;
}

h3, h4, h5, h6 {
	font-family: 'Source Serif Pro', serif;
	font-weight: bold;
	letter-spacing: -0.02em;
}

.title {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

blockquote {
    margin: 1em auto;
    width: 80%;
    font-size: 1.2em;
    font-style: oblique;
    color: var(--color-1);
    speak: none;
}

.sidebar h2 {
    font-size: 1.8em;
}

.site-name-slogan {
	font-family: 'Oswald', sans-serif;
	letter-spacing: -0.02em;
}

#superfish-main li.menuparent a.sf-depth-1,
#superfish-main li.menuparent a.sf-depth-1:hover,
#superfish-main li.menuparent a.sf-depth-1:active,
#superfish-main li.menuparent a.sf-depth-1:focus {
	font-family: 'Oswald', sans-serif;
	font-size: 1.3em;
	font-weight: normal;
}

#block-communitypower-content .views-field-type {
	font-family: 'Oswald', sans-serif;
	letter-spacing: -0.02em;
	font-weight: 500;
	text-transform: uppercase;
}

.field--name-uid,
.views-field-uid { /* people names */
	font-family: 'Source Serif Pro', serif;
	font-weight: bold;
	letter-spacing: -0.02em;
	color: var(--color-3b);
	font-size: 1.4em;
}

.site-footer h2 {
	font-size: 1.4em;
}


/* -- BEGIN Colours -- */

body {
    color: var(--near-black);
    background: var(--near-black);
}

#page,
#main-wrapper,
.region-primary-menu .menu-item a.is-active,
.region-primary-menu .menu-item--active-trail a {
    background: white;
}

a,
.link {
    color: var(--color-3b);
}

a:hover,
a:focus,
.link:hover,
.link:focus {
    color: var(--color-3b);
}

a:active,
.link:active {
    color: var(--color-3b);
}

.tabs ul.primary li a.is-active {
    background-color: #fff;
}

.tabs ul.primary li.is-active a {
    background-color: #fff;
    border-bottom-color: #fff;
}


.page-item.active .page-link {
    background-color:  var(--color-3b);
    border-color:  var(--color-3b);
}

.page-link,
.page-link:hover {
    color:  var(--color-3b);
}

.sidebar_second .block {
    background-color: var(--near-white);
    border-color: var(--near-white);
    padding: 15px 30px;
	border-radius: var(--border-radius);
}

.btn-primary {
    background-color: var(--color-3b);
    border-color: var(--color-3b);
  	border-radius: var(--border-radius);
  	padding: 0.33em 3em;
    transition: all 0.4s;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--color-3b);
    transition: all 0.4s;
}

/* -- END Colours -- */


/* Desktops and laptops -- */

@media only screen  and (min-width : 992px) {
blockquote {
    margin: 1rem 1rem 0rem 3rem;
    width: 40%;
    float: right;
}
}

/* -- END Typography -- */

/* -- BEGIN Misc Layout -- */

/* -- I can't figure out how to get the site to have fluid-container for the main page, but not elsewhere. So this is a workaround -- */

#body {
min-width: 320px;
}

#main {

min-width: 320px;
max-width: 1140px;
margin: auto;
}

/* -- Not sure why this much padding is needed, so I'm making adjustments  -- */

.region-featured-top {
	padding: 0;
}

.region-content {
	padding: 0;
}

#main-wrapper {
	padding-top: 2em;
	padding-bottom: 2em;
}

/* -- Awkwardly forcing the first column to take up 50%/6 cols rather than the built in 33%/4 cols  -- */


@media only screen and (min-width : 768px) { /* iPads and Desktops */
#sidebar_first {
    flex: 50%;
    max-width: 50%;
}
}

#sidebar_first .block .content {
font-size: 1.2em;
}

/* -- END Misc Layout -- */


/* -- BEGIN Header and Branding -- */

#navbar-top {
left: 0;
top: 0;
margin: 0;
padding: 0;
}

#navbar-top .navbar-brand {
margin-top: 0.3em;
margin-left: 1.5em;
width: 12em;
}

#navbar-top .navbar-brand:lang(fr) {
width: 13em;
}

/* -- mobile -- */

@media only screen and (max-width : 768px) {

#header {
	background: var(--color-1);
	height: 7.5em;
	transition: all 0.4s;
}

#navbar-top .region-top-header {
margin: auto;
}

#navbar-main {
position: relative;
right: 0; /* This also moves the mobile menu, so the padding is handled by .sf-accordion-toggle and #superfish-main below */
top: 1.25em;
margin: 0;
padding: 0;
}

.sf-accordion-toggle {
	margin: 0 auto;
	text-align: center;
}

}


/* -- ipads/desktops -- */

@media only screen and (min-width : 768px) {

#header {
	background: var(--color-1);
	height: 4em;
	transition: all 0.4s;
}

#navbar-main {
position: absolute;
right: 0; /* This also moves the mobile menu, so the padding is handled by .sf-accordion-toggle and #superfish-main below */
top: 0;
margin: 0;
padding: 0;
}

/* Toggle for mobile menu */

.sf-accordion-toggle {
	margin-top: 1.25em;
	margin-right: 2em;
	margin-bottom: 1em;
	text-align: right;
}

}



.block-superfishmain {
padding: 0;
}

.path-frontpage .highlighted {
	background: var(--color-1);
	line-height: 0;
}



/* -- END Header and Branding -- */

/* -- BEGIN Menu/Superfish -- */

/* Desktop Menu */

#superfish-main {
margin-right: 2em;
margin-top: 0.75em;
}

#superfish-main li.sf-depth-1 ul {
background: rgba(33,33,33,0.8);
box-shadow: unset;
margin-top: 0.75em;
}

/* Top level link color */

#superfish-main li.menuparent a.sf-depth-1,
#superfish-main li.menuparent a.sf-depth-1:hover,
#superfish-main li.menuparent a.sf-depth-1:active,
#superfish-main li.menuparent a.sf-depth-1:focus {
color: white;
text-transform: uppercase;
text-decoration: none;
padding: 0.5em 1.2vw;
}

#superfish-main .sf-clone-parent a.sf-depth-1,
#superfish-main .sf-clone-parent a.sf-depth-1:hover,
#superfish-main .sf-clone-parent a.sf-depth-1:active,
#superfish-main .sf-clone-parent a.sf-depth-1:focus,
#superfish-main a.sf-depth-2,
#superfish-main a.sf-depth-2:hover,
#superfish-main a.sf-depth-2:active,
#superfish-main a.sf-depth-2:focus {
color: white;
text-transform: uppercase;
margin-left: 1em;
text-decoration: none;
padding: 0.5em 0.4em;
}

/* If we want to do icons next to the menu items
#superfish-main .sf-clone-parent a.sf-depth-1::before,
#superfish-main a.sf-depth-2::before {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
 content: "\f0a9";
padding-right: 0.5em;
}
*/



#superfish-main-toggle {
	color: white;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.5em 2em;
	background: var(--color-3b);
	border-radius: 0.5em;
}

/* Mobile Menu */

#superfish-main-accordion li.sf-depth-1>a.sf-depth-1,
#superfish-main-accordion li.sf-depth-1>a.sf-depth-1:hover,
#superfish-main-accordion li.sf-depth-1>a.sf-depth-1:active,
#superfish-main-accordion li.sf-depth-1>a.sf-depth-1:focus {
background: rgba(33,33,33,0.8);
color: white;
text-transform: uppercase;
text-decoration: none;
}

#superfish-main-accordion .sf-clone-parent a.sf-depth-1,
#superfish-main-accordion .sf-clone-parent a.sf-depth-1:hover,
#superfish-main-accordion .sf-clone-parent a.sf-depth-1:active,
#superfish-main-accordion .sf-clone-parent a.sf-depth-1:focus,
#superfish-main-accordion a.sf-depth-2,
#superfish-main-accordion a.sf-depth-2:hover,
#superfish-main-accordion a.sf-depth-2:active,
#superfish-main-accordion a.sf-depth-2:focus {
background: rgba(33,33,33,0.8);
color: white;
text-transform: uppercase;
padding-left: 2em;
text-decoration: none;
}


/* If we want to do icons next to the menu items
#superfish-main-accordion .sf-clone-parent a.sf-depth-1::before,
#superfish-main-accordion a.sf-depth-2::before {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: "\f0a9";
padding-right: 0.5em;
}
*/

/* -- mobile -- */

@media only screen and (max-width : 768px) {
	#superfish-main-accordion {
	margin-top: 0.75em;
	}
}

/* -- ipads/desktops -- */

@media only screen and (min-width : 768px) {
	#superfish-main-accordion {
	margin-top: 0.25em;
	}
}



/* this replaces the bars with an ex when expanded */

#superfish-main-toggle.sf-expanded .fa-bars::before {
content: "\f00d";
}

/* Donate button */

#main-menu-link-contentdc71d328-077b-4fd9-a78f-8312b549cc53 a.sf-depth-1,
#main-menu-link-contentdc71d328-077b-4fd9-a78f-8312b549cc53 a.sf-depth-1:hover,
#main-menu-link-contentdc71d328-077b-4fd9-a78f-8312b549cc53 a.sf-depth-1:active,
#main-menu-link-contentdc71d328-077b-4fd9-a78f-8312b549cc53 a.sf-depth-1:focus {
color: white;
background: var(--color-3b);
padding-left: 1.5em;
padding-right: 1.5em;
margin-left: 0.5em;
border-radius: var(--border-radius);
}


/* -- END Menu -- */


/* -- BEGIN Slick/slideshow -- */


#slick-views-slideshow-block-1-1 .slick__arrow .slick-arrow::before {
color: white;
text-shadow: 0 0 1px black;
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a {
	text-transform: uppercase;
	font-weight: 400;
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a em {
	font-weight: 900;
}

/* fixes a tendency for the images not to fill the whole width of the screen? Might be a config error elsewhere causing it. */
.slick img {
width: 100%;
}

/* -- Layout -- */

/* -- mobile -- */

@media only screen and (max-width : 768px) {
	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a {
	display: block;
	font-size: 6vw;
	padding: 0.25em 0.5em;
	}
}


/* -- ipads/desktops -- */

@media only screen and (min-width : 768px) { /* -- only want to manipulate the placement on ipads/deskopts -- */

	#slick-views-slideshow-block-1-1 .slide__caption {
		position: absolute;
		top: unset;
		bottom: 5%;
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.layout-Left {
		width: 100%;
		text-align: left;
		padding: 0 35% 0 5%;
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.layout-Right {
		width: 100%;
		text-align: right;
		padding: 0 5% 0 35%;
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.layout-Center {
		width: 100%;
		text-align: center;
		padding: 0 10%;
	}


	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a {
		background: white;
		color: var(--near-black);
		padding: 0.25em 0.5em;
		font-size: 3.5vw;
		line-height: 1.8;
		-webkit-box-decoration-break: clone;
		box-decoration-break: clone;
	}

}

/* -- Caption Colours default -- */

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a {
	background: var(--color-2);
	color: var(--color-1);
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a em {
		color: var(--color-4b);
		font-style: normal;
	}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2 a:hover {
		text-decoration: none;
	}


/* -- Dark blue with red emphasis -- */


#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-BlueRed a {
	background: var(--color-1);
	color: var(--color-2);
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-BlueRed a em {
		color: var(--color-4a);
}


/* -- Dark blue with Gold emphasis -- */


#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-BlueGold a {
	background: var(--color-1);
	color: var(--color-2);
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-BlueGold a em {
		color: var(--color-5a);
}

/* -- Dark Teal with Blue emphasis -- */


#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-TealBlue a {
	background: var(--color-3b);
	color: var(--color-2);
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-TealBlue a em {
		color: var(--color-1);
}

/* -- Off white with Red emphasis -- */


#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-WhiteRed a {
	background: var(--color-2);
	color: var(--color-1);
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-WhiteRed a em {
		color: var(--color-4b);
}

/* -- Off white with teal emphasis -- */


#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-WhiteTeal a {
	background: var(--color-1);
	color: var(--color-2);
}

#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-WhiteTeal a em {
		color: var(--color-3b);
}




/* -- Blue -- */


	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Blue a {
	background: #253597;
	color: #F1F0E7;
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Blue a em {
	color: #96BCC8;
	}


/* -- Indigo -- */


	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Indigo a {
	background: #364050;
	color: #F1DF8E;
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Indigo a em {
	color: #BA2A43;
	}


/* -- Purple -- */


	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Purple a {
	background: #550D2E;
	color: #F8D046;
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Purple a em {
	color: #D4939E;
	}



/* -- Teal -- */


	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Teal a {
	background: #4B909E;
	color: var(--near-white);
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-Teal a em {
	color: #F1DF8E;
	}

	/* -- White -- */

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-White a {
	background: var(--off-white);
	color: var(--color-1);
	}

	#slick-views-slideshow-block-1-1 .views-field-field-slide-caption h2.scheme-White a em {
	color: var(--color-4b);
	}




/* -- END Slick/slideshow -- */

/* -- BEGIN Random items -- */

/* -- Pagination -- */

.pagination {
margin-top: 2em;
display: flex;
justify-content: center;
}


/* -- Language Switcher -- */

.language-switcher-language-url nav {
list-style: none;
padding: 0;
margin-top: 0.5rem;
margin-bottom: 0.5rem;

}

.language-switcher-language-url nav.links {
text-align: center;
}


.language-switcher-language-url nav .nav-link {
margin: auto;
}

.language-switcher-language-url nav .nav-link a {
background: #666;
padding: 1rem 10vw;
font-weight: bold;
border-radius: var(--border-radius);
}

.language-switcher-language-url nav .nav-link a,
.language-switcher-language-url nav .nav-link a:hover,
.language-switcher-language-url nav .nav-link a:focus,
.language-switcher-language-url nav .nav-link a:active {
color: var(--color-2);
text-decoration: none;
}


.language-switcher-language-url nav .is-active {
display: none;
}

/* -- END Random items -- */



/* -- Footer -- */


.site-footer {
    background: var(--near-black);
}

.site-footer .block {
  width: 100%;
  margin: 0 1em;
  border: 0;
}

.site-footer #block-media .fab {
font-size: 2rem;
}


#block-communitypower-search .container-inline {
  text-align: center;
}

#block-communitypower-search input.form-search {
  width: 50vw;
  background: #333333;
  color: white;
  border-radius: var(--border-radius);
}

/* BEGIN Footer card block */

.footer_card {
background-color: #444444;
padding: 2em;
color: #fff;
}

.footer_card:hover {
background-color: var(--color-1);
-webkit-transition: background 1000ms ease;
-moz-transition: background 1000ms ease;
-ms-transition: background 1000ms ease;
-o-transition: background 1000ms ease;
transition: background 1000ms ease;
}

.footer_card h2 {
text-transform: uppercase;
font-size: 1.6rem;
margin-bottom: 20px;
}

.footer_card h2 a {
color: white;
}



/* END Footer card block */

/* BEGIN Front page about us blocks */

.path-frontpage .featured-top {
	background: #f0f0e6;
}

#block-beapartofit,
#block-mailchimpsubscriptionformgetupdates,
#block-whoweare,
#block-whatwedo
 {
	display: inline-block;
	position: relative;
	overflow: hidden;
	line-height: 1;
}

#block-beapartofit .field--type-image,
#block-mailchimpsubscriptionformgetupdates .field--type-image,
#block-whoweare .field--type-image,
#block-whatwedo .field--type-image {
	position: absolute;
	bottom: 0;
}

#block-beapartofit .field--type-image img,
#block-mailchimpsubscriptionformgetupdates .field--type-image img,
#block-whoweare .field--type-image img,
#block-whatwedo .field--type-image img {
	margin: 0;
}

#block-beapartofit .field--name-body,
#block-mailchimpsubscriptionformgetupdates .field--name-body,
#block-whoweare .field--name-body,
#block-whatwedo .field--name-body {
	position: absolute;
	top: 0;
	line-height: 1.25;
}





/* mobile vs desktop sizing */

@media only screen and (max-width : 768px) { /* Mobile */
	#block-beapartofit,
	#block-mailchimpsubscriptionformgetupdates,
	#block-whoweare,
	#block-whatwedo
	 {
		width: 100%;
		height: 19em;

	}

/*  who we are - Mobile */

	#block-whoweare .field--name-body {
		top: 1em;
		left: 40%;
		right: 1em;
	}

	#block-whoweare .field--name-body h4 {
		color: white;
		font-size: 1.5em;
	}

	#block-whoweare .field--name-body p {
		color: #f0efe4;
	}

	/* what we do - Mobile */

	#block-whatwedo .field--name-body {
		top: 1em;
		right: 40%;
		left: 1em;
	}

	#block-whatwedo .field--name-body h4 {
		color: white;
		font-size: 1.5em;
	}

	#block-whatwedo .field--name-body p {
		color: #f0efe4;
	}


	/* be a part of it - Mobile */

	#block-beapartofit {
	height: 25em;
	}

	#block-beapartofit .field--name-body {
		top: 2em;
		right: 1em;
		left: 1em;
	}

	#block-beapartofit .field--name-body h4 {
		color: #1f2934;
		font-size: 2.4em;
	}

	#block-beapartofit .field--name-body p {
		color: #1f2934;
	}

	/* mailchimp sign-up - Mobile */

	#block-mailchimpsubscriptionformgetupdates {
	height: 14em;
	}

	#block-mailchimpsubscriptionformgetupdates p {
	margin-top: 5%;
	}

}

@media only screen and (min-width : 768px) { /* iPads and Desktops */
	#block-whoweare,
	#block-whatwedo
	 {
		width: 49.5%;
		height: 18em;
	}
	#block-beapartofit
	 {
		width: 65.5%;
		height: 18em;
	}
	#block-mailchimpsubscriptionformgetupdates
	 {
		width: 32.5%;
		height: 18em;
	}

	/* who we are - iPads and Desktops */

	#block-whoweare .field--name-body {
		top: 15%;
		left: 40%;
		right: 1em;
	}

	#block-whoweare .field--name-body h4 {
		color: white;
		font-size: 2.5vw;
	}

	#block-whoweare .field--name-body p {
		color: #f0efe4;
	}

	/* what we do - iPads and Desktops  */

	#block-whatwedo .field--name-body {
		top: 15%;
		right: 40%;
		left: 1em;
	}

	#block-whatwedo .field--name-body h4 {
		color: white;
		font-size: 2.5vw;
	}

	#block-whatwedo .field--name-body p {
		color: #f0efe4;
	}


	/* be a part of it - iPads and Desktops  */

	#block-beapartofit .field--name-body {
	top: 15%;
	right: 20%;
	left: 1em;
	}

	#block-beapartofit .field--name-body h4 {
		color: #1f2934;
		font-size: 2.4em;
	}

	#block-beapartofit .field--name-body p {
		color: #1f2934;
	}

	/* mailchimp sign-up - Desktop */

	#block-mailchimpsubscriptionformgetupdates p {
	margin-top: 15%;
	font-size: 0.8em;
	}

}
/* END Front page about us blocks */

/* BEGIN front page highlights */
#block-communitypower-content .views-field-field-representative-image img {
width: 100%;
height: auto;
}

#block-communitypower-content .views-field-title {
margin-bottom: 0.5em;
margin-top: 1em;
}

#block-communitypower-content .views-field-title a {
color: var(--near-black);
}

#block-communitypower-content .views-field-type {
background:var(--color-3b);
padding: 5px 15px;
margin-right: 15px;
color: #fff;
}

#block-communitypower-content .views-field-body {
margin-top: 1.2em;
}

#block-communitypower-content .view-footer {
margin-top: 2em;
margin-bottom: 2em;
}


#block-communitypower-content .view-footer .recenthighlights_readmoreupdates, #block-communitypower-content .view-footer .recenthighlights_readmorearticles {
padding: 2em 0;
text-align: center;
}

#block-communitypower-content .view-footer .recenthighlights_readmoreupdates a::before,
#block-communitypower-content .view-footer .recenthighlights_readmorearticles a::before,
 {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: "\f054";
	padding-right: 0.5em;
}


#block-communitypower-content .view-footer .recenthighlights_readmoreupdates a {
color: white;
font-weight: 500;
text-transform: uppercase;
background: var(--color-3b);
padding: 1em 2em;
border-radius: var(--border-radius);
}

#block-communitypower-content .view-footer .recenthighlights_readmorearticles a {
color: white;
font-weight: 500;
text-transform: uppercase;
background: var(--color-3b);
padding: 1em 2em;
border-radius: var(--border-radius);
}


/* END front page highlights */


/* Other blocks */

#block-views-block-cards-block-1 {
 width: 100%;
}

#block-views-block-homepage-about-card-block-1 {
background-image: url('/themes/canadians/parliamentaction.jpg');
background-size: cover;
background-position: center top;
width: 100%;
padding: 7em 0 5em 0;
color: #fff;
}

#block-views-block-homepage-about-card-block-1 .view-header {
font-size: 1.4rem;
color: white;
margin-bottom: 2em;
padding: 1em;
text-shadow: 0px 0px 6px rgba(80,0,0,1);
}

#block-views-block-homepage-about-card-block-1 .accomplishment_card {
margin-bottom: 3rem;
}


#block-views-block-homepage-about-card-block-1 a {
color: #fff;
font-weight: 500;
text-shadow: 0px 0px 6px rgba(80,0,0,1);
}

#block-views-block-homepage-about-card-block-1 .homepage_about_card_icon {
font-size: 2rem;
text-align: center;
}

#block-views-block-homepage-about-card-block-1 .homepage_about_card_text {
font-size: 1.4rem;
font-weight: 500;
text-shadow: 0px 0px 6px rgba(80,0,0,1);
}

@media only screen and (max-width: 992px) {

#block-views-block-homepage-about-card-block-1 {
padding: 2em 0 1em 0;
}

#block-views-block-homepage-about-card-block-1 .view-header {
font-size: 1.2rem;
}

#block-views-block-homepage-about-card-block-1 .homepage_about_card_text {
text-align: center;
font-size: 1.2rem;
}
}
#views-bootstrap-homepage-about-card-block-1 {
margin: auto;
}



/* BEGIN random block theming */


#block-communitypower-content .view-footer .register-amm a {
color: white;
font-weight: 500;
text-transform: uppercase;
background: var(--color-3b);
padding: 1em 2em;
border-radius: var(--border-radius);
}

#block-ammquestions .content .register-amm a {
color: white;
font-weight: 500;
text-transform: uppercase;
background: var(--color-3b);
padding: 1em 2em;
border-radius: var(--border-radius);
}

.a2a_kit {
display: block;
margin: 1em;
}

/* END random block theming */



/* -- Image credit -- */

.field--name-field-image-credit {
text-align: right;
color: #333;
font-size: 0.8em;
font-style: oblique;
}

/* -- Chapter logo align -- */

.node .field--name-field-chapter-logo {
margin: 0px 0px 15px 15px;
width: 30%;
float: right;
}

/* -- Personel/People/Board/Candidate Photo/bios -- */

.image-style-portrait {
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#views-bootstrap-staff-page-1 .views-field-name,
#views-bootstrap-board-page-1 .views-field-name-1,
.views-field-field-name,
.views-field-field-last-name {
margin: 0.5em 0;
font-weight: 500;
color: var(--color-1);
font-family: 'Oswald', sans-serif;
font-size: 1.4em;
}

.views-field-user-picture .field-content {
    text-align: center;
}

.field--type-image img, .field--name-field-user-picture img {
	margin: 0;
}


/* -- Related Resources Block-- */


.view-related-actions .field-content a,
.view-related-actions .field-content a:hover {
font-weight: 500;
}

.view-related-actions .views-field-field-representative-image {
opacity: 0.6;
filter: alpha(opacity=60);
}
.view-related-actions .views-row {

margin-bottom: 1em;
}
/* -- Related Resources Block-- */


.view-related-resources .field-content {
font-weight: 500;
}

/* -- Related Articles Block-- */


.view-author-recent-articles .author-recent-article, .view-related-articles .related-article, .view-related-actions, .view-related-resources, .author-recent-article {
margin-bottom: 1em;
margin-left: 1em;
margin-right: 1em;
}

.view-author-recent-articles .author-recent-article a,
.view-author-recent-articles .author-recent-article a:hover,
.view-related-articles .related-article a,
.view-related-articles .related-article a:hover {
font-weight: 500;
}



/* -- Content: Blog/analysis -- */

.node--type-blog .node__content figure.align-right {
width: 40%;
height: auto;
margin-left: 1em;
}

.node--type-blog .node__content figure.align-left {
width: 40%;
height: auto;
margin-right: 1em;
}

.node--type-blog .node__content figcaption {
color: #333;
font-size: 0.8em;
font-style: oblique;
}

.node--type-blog .node__content img {
max-width: 100%;
}

.views-field-view-node {
text-align: right;
margin-bottom: 1em;
}


/* -- Content Read Link -- */

.content-link {
	display: block;
	margin-left: 50%;
	margin-top: 1em;
}


.content-link a,
.content-link a:hover,
.content-link a:active,
.content-link a:focus {
font-weight: 900;
text-decoration: none;
}

.content-link a::before {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: "\f054";
	padding-right: 0.5em;
	color: var(--color-3b)
}

/* -- Content: article/update -- */

.media-update, .update-statement {
	border-bottom: 1px solid #ddd;
	margin-bottom: 2em;
	padding-bottom: 2em;
	margin-left: 15px;
}

/* -- BEGIN page: campaign landing pages with Gutenberg -- */

.node--type-campaign-landing-page { /* -- No idea why Gutenberg overrides the fonts -- */
font-family: 'Source Sans Pro', sans-serif;
}

.node--type-campaign-landing-page .font-oswald { /* -- give us the opportunity to add fonts in with css classes -- */
	font-family: 'Oswald', sans-serif;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}

.node--type-campaign-landing-page .font-sourceserif {
	font-family: 'Source Serif Pro', serif;
		letter-spacing: -0.02em;
}

.node--type-campaign-landing-page #main {
max-width: unset;
}

.node--type-campaign-landing-page #main-wrapper {
padding: 0;
}

.node--type-campaign-landing-page #content {
padding: 0;
}

.node--type-campaign-landing-page .node__content {
margin: 0;
}

.node--type-campaign-landing-page .node--unpublished {
	padding: 0;
}


.node--type-campaign-landing-page .block-page-title-block {
display: none;
}

.node--type-campaign-landing-page .wp-block-cover,
.node--type-campaign-landing-page .wp-block-cover-image { /* Gutenberg assumes we use covers only for headers. This allows us to use it in smaller spaces. */
    min-height: unset;
    height: unset;
}

.action-block .wp-block-button__link {
    width: 100%;
    margin: 5px;
}
.action-block .wp-block-button__link:hover {
    background: #fcb900;
}

.node--type-campaign-landing-page .addtoany_list.a2a_kit_size_32 > a {
width: 25%;
}

.node--type-campaign-landing-page .addtoany_list.a2a_kit_size_32 a > .a2a_svg {
height: auto;
width: 100%;
padding: 5px;
}

.node--type-campaign-landing-page .addtoany_list.a2a_kit_size_32 a > .a2a_svg svg {
width: 32px;
}

.node--type-campaign-landing-page .addtoany_list.a2a_kit_size_32 > a {
width: 25%;
}

.node--type-campaign-landing-page .addtoany_list.a2a_kit_size_32 a > .a2a_svg {
height: auto;
width: 100%;
padding: 5px;
}

.node--type-campaign-landing-page .addtoany_list.a2a_kit_size_32 a > .a2a_svg svg {
width: 32px;
}

	@media only screen and (max-width : 576px) { /* Mobile adjustments */
		.node--type-campaign-landing-page .wp-block-spacer {
		max-height: 50px;
	}
}



.node--type-campaign-landing-page #block-communitypower-content .views-field-title {
	margin: 0;
}
.node--type-campaign-landing-page #block-communitypower-content .views-field-title a {
	color: var(--color-3a);
}

/* -- END page: campaign landing pages with Gutenberg -- */

/* -- BEGIN pages: Donation pages -- */

.node--type-fundraising #main-wrapper {
	background: var(--color-6a);
}

@media only screen and (max-width : 576px) { /* hide represenative image on Mobile */
	.node--type-fundraising #block-communitypower-contentfield-6 {
		display: none;
	}
}

.node--type-fundraising .sidebar_first {
	background-color: var(--color-3b);
}

.node--type-fundraising .sidebar .block {

	border: 0;
	color: white;
	font-size: 1em;
}

.node--type-fundraising .sidebar .block a:link,
.node--type-fundraising .sidebar .block a:visited,
.node--type-fundraising .sidebar .block a:hover,
.node--type-fundraising .sidebar .block a:focus,
.node--type-fundraising .sidebar .block a:active {
	color: var(--color-5a);
}

.node--type-fundraising #content {
	background: white;
	border-radius: var(--border-radius);
	padding: 1em;
}

.node--type-fundraising .webform-actions {
	text-align: center;
}

.node--type-fundraising .webform-actions .btn-primary {
	background: var(--color-4a);
	border-color: transparent;
	padding: 1em 20%;
	font-size: 1.4em;
	text-transform: uppercase;
	font-weight: bold;
	transition: all 0.4s;
}

.node--type-fundraising .webform-actions .btn-primary:hover,
.node--type-fundraising .webform-actions .btn-primary:focus {
	background: var(--color-4b);
	transition: all 0.4s;
}

/* -- END pages: Donation pages -- */

/* -- BEGIN - Donation/Stripe Webforms -- */

/* ---------- Tidying Up The Stripe field ----------- */

.node--type-fundraising .StripeElement {
padding: 10px;
border-radius: 5px;
}

/* ---------- Amount selector ----------- */

.node--type-fundraising #edit-amount label {
background: #ddd;
color: #aaa;
font-weight: 900;
font-size: 1em;
border-radius: 5px;
padding: 0.5em;
margin: 0;
width: 100%;
text-align: center;
}

.node--type-fundraising #edit-amount label:hover {
background: #ccc;
color: #555;
transition: all 300ms ease;
}

.node--type-fundraising #edit-amount label::before {
font-family: "Font Awesome 5 Free";
font-weight: 500;
content: "\f111";
position: absolute;
left: 1em;
}

.node--type-fundraising #edit-amount input.form-radio:checked ~ label {
background: #008484;
transition: all 300ms ease;
color: #fff;
}

.node--type-fundraising #edit-amount input.form-radio:checked ~ label::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f058";
transition: all 300ms ease;
}

.node--type-fundraising #edit-amount input[type="radio"] {
display: none;
}

/* ---------- div responsive sizing ----------- */

@media only screen and (max-width : 576px) { /* Mobile */
.node--type-fundraising .form-check.form-item-amount-radios {
width: 100%;
padding: 0;
margin-bottom: 1em;
min-width: 10em;
}
}


@media only screen and (min-width : 576px) and (max-width : 992px) { /* iPads */
.node--type-fundraising .form-check.form-item-amount-radios {
width: 32%;
padding: 0;
margin: 0 0 0.5em 0;
min-width: 10em;
}
}

@media only screen and (min-width : 992px) { /* Desktops */
.node--type-fundraising .form-check.form-item-amount-radios {
width: 16%;
padding: 0;
margin: 0 0 0.5em 0;
min-width: 10em;
}
}


/* ---------- Opt-ins ----------- */
.node--type-fundraising label[for="edit-monthly_donation"],
.node--type-fundraising label[for="edit-email-opt-in"],
.node--type-fundraising label[for="edit-membership-opt-in"],
.node--type-fundraising label[for="edit-chapter-opt-in"] {
color: #555;
font-size: 1em;
}

.node--type-fundraising label[for="edit-monthly_donation"]:hover,
.node--type-fundraising label[for="edit-email-opt-in"]:hover,
.node--type-fundraising label[for="edit-membership-opt-in"]:hover,
.node--type-fundraising label[for="edit-chapter-opt-in"]:hover {
color: #555;
transition: all 300ms ease;
}

.node--type-fundraising label[for="edit-monthly_donation"]::before,
.node--type-fundraising label[for="edit-email-opt-in"]::before,
.node--type-fundraising label[for="edit-membership-opt-in"]::before,
.node--type-fundraising label[for="edit-chapter-opt-in"]::before {
font-family: "Font Awesome 5 Free";
font-weight: 500;
content: "\f111";
}
.node--type-fundraising input[name="monthly_donation"]:checked ~ label,
.node--type-fundraising input[name="email_opt_in"]:checked ~ label,
.node--type-fundraising input[name="membership_opt_in"]:checked ~ label,
.node--type-fundraising input[name="chapter_opt_in"]:checked ~ label {
transition: all 300ms ease;
color: #333
}
.node--type-fundraising input[name="monthly_donation"]:checked ~ label::before,
.node--type-fundraising input[name="email_opt_in"]:checked ~ label::before,
.node--type-fundraising input[name="membership_opt_in"]:checked ~ label::before,
.node--type-fundraising input[name="chapter_opt_in"]:checked ~ label::before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f058";
transition: all 300ms ease;
color: #008484;
}

.node--type-fundraising input[name="monthly_donation"],
.node--type-fundraising input[name="email_opt_in"],
.node--type-fundraising input[name="membership_opt_in"],
.node--type-fundraising input[name="chapter_opt_in"] {
display: none;
}

.node--type-fundraising .form-check.form-monthly_donation,
.node--type-fundraising .form-check.form-item-email-opt-in,
.node--type-fundraising .form-check.form-item-membership-opt-in,
.node--type-fundraising .form-check.form-item-chapter-opt-in {
padding: 0;
margin: 0 0 1em 0;
}


.webform-element-more {
.node--type-fundraising margin-left: 2em;

}
.node--type-fundraising .webform-element-more--link::before {
font-family: "Font Awesome 5 Free";
content: "\f0da";
margin-right: 0.5em;
}

.node--type-fundraising .webform-element-more--link {
font-weight: bold;
}

.node--type-fundraising .webform-element-more.is-open .webform-element-more--link::before {
font-family: "Font Awesome 5 Free";
content: "\f0d7";
margin-right: 0.5em;
}

.node--type-fundraising .webform-element-more--content {
font-weight: 100;
padding: 0.5em;
background: #eeeeee;
}

/* -- END - Donation/Stripe Webforms -- */

/* -- BEGIN pages: Action pages -- */

.node--type-actions #main-wrapper {
	background: var(--color-6a);
}

.node--type-actions .sidebar_first {
	background: var(--color-3b);
}

.node--type-actions .sidebar .block {
	border: 0;
	color: white;
	font-size: 1em;
	margin: 0
}

.node--type-actions .sidebar .block a:link,
.node--type-actions .sidebar .block a:visited,
.node--type-actions .sidebar .block a:hover,
.node--type-actions .sidebar .block a:focus,
.node--type-actions .sidebar .block a:active {
	color: var(--color-5a);
}


.node--type-actions #content {
	background: white;
	border-radius: var(--border-radius);
	padding: 1em;
}

.node--type-actions .webform-actions {
	text-align: center;
}

.node--type-actions .webform-actions .btn-primary {
	background: var(--color-3b);
	border-color: transparent;
	padding: 1em 20%;
	font-size: 1.4em;
	text-transform: uppercase;
	font-weight: bold;
	transition: all 0.4s;
}

.node--type-actions .webform-actions .btn-primary:hover,
.node--type-actions .webform-actions .btn-primary:focus {
	background: var(--color-3b);
	transition: all 0.4s;
}

/* -- END pages: Action pages -- */

/* -- Individual pages: Our History -- */

body.page-node-7 .main-content h3 {
border-left: 5px var(--color-1) solid;
padding: 0 30px 30px 30px;
float: left;
clear: right;

body.page-node-7 .main-content p {
margin-left: 100px;
margin-bottom: 2rem;
margin-left: 20%;
}


/* -- BEGIN Individual pages: Jobs - views block -- */

.view-job-posting .views-row {
  padding-top: 25px;
	padding-bottom: 25px;
	border-bottom: solid 1px #333;

}

/* -- END Individual pages: -- */
