/*
Theme Name: Diaspora Alliance
Author: Interlock Solutions
Author URI: https://interlocksolutions.com/
Version: 1.0
*/

/******************************************/
/*** Boilerplate Styles 				***/
/******************************************/

* {
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif;
	vertical-align: baseline;
}

html {
	scroll-behavior: smooth;
}

body {
	line-height: 1;
}

a {
	text-decoration-skip-ink: auto;
	text-decoration: none;
}

a[href^="tel"] {
	color: inherit;
	text-decoration: none;
}

button {
	outline: 0;
}

ol, ul {
	list-style: none;
	margin-bottom: 0;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

q {
	display: inline;
	font-style: italic;
}

q:before {
	content: '"';
	font-style: normal;
}

q:after {
	content: '"';
	font-style: normal;
}

textarea, input[type="text"], input[type="button"], input[type="submit"], input[type="reset"], input[type="search"], input[type="password"] {
	-webkit-appearance: none;
	appearance: none;
	border-radius: 0;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

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

th, td {
	padding: 2px;
}

big {
	font-size: 120%;
}

small, sup, sub {
	font-size: 80%;
}

sup {
	vertical-align: super;
}

sub {
	vertical-align: sub;
}

dd {
	margin-left: 20px;
}

kbd, tt {
	font-family: courier;
	font-size: 12px;
}

ins {
	text-decoration: underline;
}

del, strike, s {
	text-decoration: line-through;
}

dt {
	font-weight: bold;
}

address, cite, var {
	font-style: italic;
}

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

.sticky {

}

.bypostauthor {

}

.wp-caption {

}

.wp-caption-text {

}

.gallery-caption {

}

.alignright {

}

.alignleft {

}

.aligncenter {

}

/******************************************/
/*** Structure Styles 					***/
/******************************************/

.wrapper {
	width: 100%;
	margin: 0 auto;
	position: relative;
}

#HeaderWrapper,
header#PageTitle,
div.SectionContent,
#FooterWrapper {
	width: 100%;
	max-width: 650px !important;
	display: flex;
	flex-direction: column;
	margin: 0 auto !important;
	padding: 0 25px;
}

main {
	min-height: 400px;
	width: 100%;
	margin: 0 auto !important;
}

#container {
	padding-top: 52px;
}

@media screen and (max-width: 767px) {
	#HeaderWrapper,
	header#PageTitle,
	div.SectionContent,
	#FooterWrapper {
		max-width: 500px !important;
	}
}


/******************************************/
/*** Header/Nav styles 					***/
/******************************************/
#HeaderWrapper {
	display: block;
}

header#header {
	position: fixed;
	width: 100%;
	background: #000;
	color: #fff;
	z-index: 99999;
}

#SiteTitle,
#SiteTitleMenuOpen {
	font: 600 22px/26px 'IBM Plex Sans', sans-serif;
	color: #fff;
	padding: 13px 0;
	min-height: 52px;
	width: calc(100% - 42px);
}

#SiteTitle a,
#SiteTitleMenuOpen a {
	color: #fff;
	text-decoration: none !important;
}

#SiteTitle a:hover,
#SiteTitle:hover,
#SiteTitleMenuOpen:hover {
	color: #fff;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
	text-decoration-thickness: 1px !important;
	cursor: pointer;
}

nav#menu {
	padding: 5px 0 10px;
}

nav#menu li a {
	font: 700 22px/26px 'IBM Plex Sans', sans-serif;
	color: #fff;
	text-decoration: none;
}

nav#menu li a:hover {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}

/*nav#menu li a:hover:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '\21b7';
	display: inline-block;
	color: #fff;
	margin-left: 3px;
	border-bottom: none !important;
}*/

#menuLink {
	width: 32px;
	height: 32px;
	float: right;
	margin: 10px 0 10px 10px;
}

#menuLink a {
	display: block;
	width: 32px;
	height: 32px;
	background: url('/wp-content/themes/diasporaalliance/images/hamburger2.png');
}

@media screen and (max-width: 767px) {
	#SiteTitle,
	 #SiteTitleMenuOpen {
		font-size: 19px;
	}

	nav#menu li a {
		font: 700 19px/22px 'IBM Plex Sans', sans-serif;
	}
}


/******************************************/
/*** Logo Styles 						***/
/******************************************/
.titlePlus20 {
	letter-spacing: 0.5px;
	display: inline-block;
}

.titleMinus80 {
	letter-spacing: -1.5px;
	display: inline-block;
}

.titleMinus60 {
	letter-spacing: -.5px;
	display: inline-block;
}

.titleMinus230 {
	letter-spacing: -4px;
	display: inline-block;
}

.titleMinus20 {
	letter-spacing: 0;
	display: inline-block;
}

.titleZero {
	letter-spacing: -0.1px;
	display: inline-block;
}

@media screen and (max-width: 767px) {
	.titlePlus20 {
		letter-spacing: 0.5px;
	}

	.titleMinus80 {
		letter-spacing: -1.5px;
	}

	.titleMinus60 {
		letter-spacing: -.5px;
		display: inline-block;
	}

	.titleMinus230 {
		letter-spacing: -4px;
		display: inline-block;
	}

	.titleMinus20 {
		letter-spacing: 0;
		display: inline-block;
	}

	.titleZero {
		letter-spacing: -0.1px;
		display: inline-block;
	}
}


/******************************************/
/*** Custom General Styles 				***/
/******************************************/

:before,
:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
}

h1, h2, h3, h4, h5, h6, p {
	max-width: 650px;
}

h1 {
	font: 700 29px/33px 'IBM Plex Sans', sans-serif;
	color: #000;
	margin: 0;
}

h2 {
	font: 700 22px/26px 'IBM Plex Sans', sans-serif;
	color: #000;
	margin: 0 0 0 54px;
}

strong {
	font-weight: 700;
}

em {
	font-style: italic;
}

p, #content ul, #content ol {
	font: 400 22px/26px 'IBM Plex Sans', sans-serif;
	color: #000;
	margin-bottom: 0 !important;
}

/*#content ul li, #content ol li {
	padding: 0 0 6px !important;
}*/

p img {
	margin-top: 10px;
}

#content h2 a,
#content h3 a,
#content h4 a,
#content h5 a,
#content h6 a,
#content p a,
#content ul li a,
#content ol li a  {
	color: #000;
	display: inline-block;
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}

#content a:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '\2197';
	display: inline-block;
	color: #000;
	margin-left: 3px;
}

#content h2 a:hover,
#content h2 a:focus,
#content h2 a:active,
#content h3 a:hover,
#content h3 a:focus,
#content h3 a:active,
#content h4 a:hover,
#content h4 a:focus,
#content h4 a:active,
#content h5 a:hover,
#content h5 a:focus,
#content h5 a:active,
#content h6 a:hover,
#content h6 a:focus,
#content h6 a:active,
#content p a:hover,
#content p a:focus,
#content p a:active,
#content ul li a:hover,
#content ul li a:focus,
#content ul li a:active,
#content ol li a:hover,
#content ol li a:focus,
#content ol li a:active {
	color: #000;
}

#content h2 a:hover:before,
#content h2 a:focus:before,
#content h2 a:active:before,
#content h3 a:hover:before,
#content h3 a:focus:before,
#content h3 a:active:before,
#content h4 a:hover:before,
#content h4 a:focus:before,
#content h4 a:active:before,
#content h5 a:hover:before,
#content h5 a:focus:before,
#content h5 a:active:before,
#content h6 a:hover:before,
#content h6 a:focus:before,
#content h6 a:active:before,
#content p a:hover:before,
#content p a:focus:before,
#content p a:active:before,
#content ul li a:hover:before,
#content ul li a:focus:before,
#content ul li a:active:before,
#content ol li a:hover:before,
#content ol li a:focus:before,
#content ol li a:active:before {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: ')';
	display: inline-block;
	color: #000;
	margin-left: 3px;
}

#content h2 a:hover:after,
#content h2 a:focus:after,
#content h2 a:active:after,
#content h3 a:hover:after,
#content h3 a:focus:after,
#content h3 a:active:after,
#content h4 a:hover:after,
#content h4 a:focus:after,
#content h4 a:active:after,
#content h5 a:hover:after,
#content h5 a:focus:after,
#content h5 a:active:after,
#content h6 a:hover:after,
#content h6 a:focus:after,
#content h6 a:active:after,
#content p a:hover:after,
#content p a:focus:after,
#content p a:active:after,
#content ul li a:hover:after,
#content ul li a:focus:after,
#content ul li a:active:after,
#content ol li a:hover:after,
#content ol li a:focus:after,
#content ol li a:active:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '/';
	display: inline-block;
	color: #000;
	margin-left: 3px;
}

.WhiteText h1,
.WhiteText h2,
.WhiteText h3,
.WhiteText h4,
.WhiteText h5,
.WhiteText h6,
.WhiteText p,
.WhiteText ul li,
.WhiteText ol li,
.WhiteText h2 a,
.WhiteText h3 a,
.WhiteText h4 a,
.WhiteText h5 a,
.WhiteText h6 a,
.WhiteText p a,
.WhiteText a,
.WhiteText ul li a,
.WhiteText ol li a  {
	color: #fff !important;
}

.WhiteText a:after,
.WhiteText h2 a:hover:before,
.WhiteText h2 a:focus:before,
.WhiteText h2 a:active:before,
.WhiteText h3 a:hover:before,
.WhiteText h3 a:focus:before,
.WhiteText h3 a:active:before,
.WhiteText h4 a:hover:before,
.WhiteText h4 a:focus:before,
.WhiteText h4 a:active:before,
.WhiteText h5 a:hover:before,
.WhiteText h5 a:focus:before,
.WhiteText h5 a:active:before,
.WhiteText h6 a:hover:before,
.WhiteText h6 a:focus:before,
.WhiteText h6 a:active:before,
.WhiteText p a:hover:before,
.WhiteText p a:focus:before,
.WhiteText p a:active:before,
.WhiteText ul li a:hover:before,
.WhiteText ul li a:focus:before,
.WhiteText ul li a:active:before,
.WhiteText ol li a:hover:before,
.WhiteText ol li a:focus:before,
.WhiteText ol li a:active:before,
.WhiteText h2 a:hover:after,
.WhiteText h2 a:focus:after,
.WhiteText h2 a:active:after,
.WhiteText h3 a:hover:after,
.WhiteText h3 a:focus:after,
.WhiteText h3 a:active:after,
.WhiteText h4 a:hover:after,
.WhiteText h4 a:focus:after,
.WhiteText h4 a:active:after,
.WhiteText h5 a:hover:after,
.WhiteText h5 a:focus:after,
.WhiteText h5 a:active:after,
.WhiteText h6 a:hover:after,
.WhiteText h6 a:focus:after,
.WhiteText h6 a:active:after,
.WhiteText p a:hover:after,
.WhiteText p a:focus:after,
.WhiteText p a:active:after,
.WhiteText ul li a:hover:after,
.WhiteText ul li a:focus:after,
.WhiteText ul li a:active:after,
.WhiteText ol li a:hover:after,
.WhiteText ol li a:focus:after,
.WhiteText ol li a:active:after {
	color: #fff !important;
}

.White {
	background: #fff;
}

.Gray {
	background: #f0f0f0;
}

.Yellow {
	background: #ffffe5;
}

.Tan {
	background: #c9b099;
}

.Brown {
	background: #9c7861;
}

.ContentSectionBg {
	border-bottom: solid 1px #000;
	padding: 16px 0 21px;
}

.ContentSectionBg#board {
	border-bottom: none;
	padding:  16px 0 0;
}

.SectionContent p:not(:first-of-type) {
	text-indent: 54px;
}

.SectionContent p.NoIndent {
	text-indent: 0;
}

.SectionContent p.BottomMargin {
	margin-bottom: 20px !important;
}

#content .SectionContent ul.BottomMargin,
#content .SectionContent ol.BottomMargin {
	margin-bottom: 14px !important;
}

#assets .SectionContent p {
	text-indent: 0;
}

#assets .SectionContent p a,
#assets .SectionContent p a:hover {
	display: block;
	text-decoration: none;
}

#assets .SectionContent p a:before,
#assets .SectionContent p a:hover:before,
#assets .SectionContent p a:after,
#assets .SectionContent p a:hover:after {
	content: '';
	margin-left: 0;
}

#assets .SectionContent p a img {
	padding-top: 25px;
}

form {
	width: 100% !important;
	margin-top: 5px;
}

input,
select,
textarea {
	width: 100% !important;
	color: #000 !important;
	font-size: 22px !important;
	line-height: 31px !important;
	font-weight: 400 !important;
	border: solid 1px #fff !important;
	padding: 3px !important;
	margin-bottom: 5px !important;
}

textarea {
	height: 120px !important;
}

select .select-arrow {
	display: none !important;
}

select.wpcf7-form-control {
	background: #fff url('images/arrow-down-solid-sm.svg') right 50% no-repeat !important;
	-moz-appearance: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	background-position-x: calc(100% - 10px) !important;
}

input[type=submit] {
	width: auto !important;
	background: transparent !important;
	border: none !important;
	font-size: 22px !important;
	line-height: 31px !important;
	font-weight: 700 !important;
	text-decoration: underline !important;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}

#ButtonWrapper {
	background: #c9b099 !important;
	margin-left: 54px;
	font-size: 22px !important;
	line-height: 31px !important;
}

#ButtonWrapper:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '\21AA';
	display: inline-block;
	color: #000;
	margin-left: 3px;
}

#ButtonWrapper:hover:before {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: ')';
	display: inline-block;
	color: #000;
	margin-left: 3px;
}

#ButtonWrapper:hover:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '/';
	display: inline-block;
	color: #000;
	margin-left: 3px;
}

.wpcf7-spinner {
	display: none !important;
}

@media screen and (max-width:  767px) {
	h1, h2, h3, h4, h5, h6, p {
		max-width: 500px;
	}

	h1 {
		font: 700 22px/26px 'IBM Plex Sans', sans-serif;
	}

	h2 {
		font: 700 19px/22px 'IBM Plex Sans', sans-serif;
	}

	p, #content ul, #content ol {
		font: 400 19px/22px 'IBM Plex Sans', sans-serif;
	}

	input,
	select,
	textarea,
	input[type=submit],
	#ButtonWrapper {
		font-size: 19px !important;
		line-height: 29px !important;
	}
}

/******************************************/
/*** Footer styles 						***/
/******************************************/

footer#footer {
	background: #000;
	color: #fff;
	font-size: 15px;
	line-height: 19px;
	padding: 15px 0;
}

#FooterLink {
	color: #fff;
	padding-bottom: 10px;
}

#FooterText a,
#FooterLink a {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
}

#FooterLink a:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '\2197';
	display: inline-block;
	color: #fff;
	margin-left: 3px;
}

#FooterText a:hover:before,
#FooterLink a:hover:before {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: ')';
	display: inline-block;
	color: #fff;
	margin-left: 3px;
}

#FooterText a:hover:after,
#FooterLink a:hover:after {
	font-family: 'IBM Plex Sans', Helvetica, Arial, sans-serif !important;
	content: '/';
	display: inline-block;
	color: #fff;
	margin-left: 3px;
}

#bottomLogo {
	font-size: 15px;
	line-height: 15px;
	font-weight: 400;
	padding: 10px 0;
	min-height: 36px;
}

.footerPlus20 {
	letter-spacing: 0.8px;
	display: inline-block;
}

.footerMinus80 {
	letter-spacing: -0.6px;
	display: inline-block;
}

.footerMinus60 {
	letter-spacing: -0.4px;
	display: inline-block;
}

.footerMinus230 {
	letter-spacing: -2.3px;
	display: inline-block;
}

.footerMinus20 {
	letter-spacing: 0.2px;
	display: inline-block;
}

.footerZero {
	letter-spacing: 0;
	display: inline-block;
}


/******************************************/
/*** Default Screen Reader styles 		***/
/******************************************/

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
	word-break: normal;
}

.screen-reader-text:focus {
	background-color: #f7f7f7;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, .6);
	clip: auto !important;
	-webkit-clip-path: none;
	clip-path: none;
	color: #007acc;
	display: block;
	font-size: 14px;
	font-size: .875rem;
	font-weight: 700;
	height: auto;
	right: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

.skip-link {
	left: -9999rem;
	top: 2.5rem;
	z-index: 999999999;
	text-decoration: underline;
}

.skip-link:focus {
	display: block;
	left: 6px;
	top: 7px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	line-height: normal;
	padding: 15px 23px 14px;
	z-index: 100000;
	right: auto;
}

.visually-hidden:not(:focus):not(:active),
.form-allowed-tags:not(:focus):not(:active) {
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(1px 1px 1px 1px);
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}