/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 24 2023 | 21:35:46 */
/* special tools --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* styles the areas on the front end where we added group directories in accordions */

.accordion-containing-group-types-shortcodes-wd .subnav-filters {
	margin-top: 10px !important;
	margin-bottom: 10px !important;
	float: left !important;

}

.accordion-containing-group-types-shortcodes-wd .buddypress-wrap .grid-filters {
	border: 1.5px solid #c2c2c2 !important;
}

.accordion-containing-group-types-shortcodes-wd .bp-feedback.info {
	display:none;
}

.accordion-containing-group-types-shortcodes-wd .bp-shortcode-wrap .dir-list {
	border: none;
}

.accordion-containing-group-types-shortcodes-wd .groups-dir-list .item-entry .list-wrap {
	box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;
	
}

/* End styles the areas on the front end where we added group directories in accordions */

.fl-module-rich-text p {
	margin-top: 5px !important;
	margin-bottom: 22px !important;
}

body.fl-builder {
	background-color: white;
}

.zero-margin-bottom-wd .fl-heading, .zero-margin-bottom-wd .fl-module-content, .zero-margin-bottom-wd p {
	 margin-bottom: 0px !important;
}



.text-shadow-wd .fl-module-content .fl-heading .fl-heading-text, .text-shadow-wd p {
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.86) !important;
}

.center-wd {
	margin: auto !important;
}

.centered-paragraph-wd {
	max-width: 950px !important;
	margin: auto !important;
}

.justify-wd p {
	text-align: justify !important;
}

/* makes menu category items unclickable

.unclickable-wd > a {
pointer-events: none;
}
*/

/* this gives bullet lists some vertical space between bullets. in use. */

.bullet-list-wd li {
	margin-bottom: 26px;
}

/* special items ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.comments-area {
	border: none;
}

/* fixes buddyboss issue with group subnavs having a strange looking grey background */

.bp-single-vert-nav .subnav {
	background-color: white;
}

/*styles the button added as a widget to the right sidebar of the activity feed under groups - dd */

#block-2 {
	background: none;
	border: none;
	padding: 0;
	display: none;
}


.home-page #breadcrumbs {
  display: none;
}

/* this raises the horizontal underline under the active activity feed filter on the activity feed page menu under "all updates", "Likes", etc. on wssnow.org/activity-feed */

.bp_activity div.bb-component-nav-item-point {
	padding-bottom:2px !important;
}


/* activity feed sidebar widget containing button for team tenets */

#block-11.widget_block {
	background-color: none;
	border: none;
	padding: 0px;
}

#block-11.widget_block p {
	margin: 0px !important;
}

.row-breadcrumbs-wd .fl-row-content-wrap {
	background-color: #e7e9ec !important;
}

.row-breadcrumbs-wd .fl-module-content {
	text-align: center !important;
	margin-left: auto !important;
	margin-right: auto !important;
}




/* styles posts */

/* styles strategic-organizational-documents */



.post.category-strategic-organizational-documents .entry-meta, .post.category-wss-education .entry-meta {
	display: none !important;
}

.post-meta-wrapper-main .post-meta-wrapper {
	display:none !important;
}

.post.category-strategic-organizational-documents .entry-header, .post.category-wss-education .entry-header {
	text-align: center !important;
}

/* styles wp forms */

.row-form-wd .fl-row-content {
	max-width: 700px !important;
	
}

.row-form-wd .fl-row-content-wrap {
	padding-bottom: 0px !important;
}

.row-form-wd .fl-module-heading .fl-module-content {
	margin-bottom: 0px !important;
}


/* This styles the form elements only */
.wpforms-container {
    margin: 0 auto !important;
    width: 100% !important;
	text-align: center !important;
}
 
/* This styles the submit button */
.wpforms-submit-container  {
    display: inline-block !important;
    text-align: center !important;
    width: 100% !important;
}

.wpforms-container input, .wpforms-container textarea {
	padding: 7px 10px !important;
	min-height: 59px;
	color: #000000 !important;
	font-size: 18px !important;
	border: 2px solid #B4DBDC !important;
	border-radius: 0px !important;
}

.wpforms-field {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}

.wpforms-container button {
    display: block !important;
    width: 100% !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    background-color: #b4dbdc !important;
    font-family: "Open Sans", sans-serif !important; 
    font-size: 20px !important;
    font-weight: 700 !important;
    color: black !important;
	border-radius: 0px !important;
	text-transform: uppercase !important;
	border: 2px solid #B4DBDC !important;
}

.wpforms-container button:hover {
    background-color: black !important;
    color: #FFFFFF !important;
	border-radius: 0px !important;
	text-transform: uppercase !important;
	border: 2px solid #B4DBDC !important;
}


.wpforms-submit-container {
	padding-top: 5px !important;
}

.wpforms-confirmation-container-full p {
	margin-bottom: 0px !important;	
	color: black !important;
}

.wpforms-confirmation-container-full {
	background-color: #b4dbdc !important;

}


/* styles place holder text */


.wpforms-container ::-webkit-input-placeholder { /* Chrome and Safari */
   color: #000000 !important;
   opacity: 1;
	font-size: 18px;
}

.wpforms-container :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: #000000;
   opacity: 1;
	font-size: 18px;
}

.wpforms-container ::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: #000000;
   opacity: 1;
	font-size: 18px;
}

.wpforms-container :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #000000;
   opacity: 1;
	font-size: 18px;
}

.wpforms-container ::-ms-input-placeholder { /* Microsoft Edge */
   color: #000000;
   opacity: 1;
	font-size: 18px;
}

.wpforms-container ::placeholder {
   color: #000000 !important;
   opacity: 1;
	font-size: 18px;
}

/* embedded Monday forms */

.monday-form-embed-wd iframe {
	width: 100% !important;
	min-height: 1100px !important;
	box-shadow: none !important;
}

.monday-form-embed-wd .fl-module-content {
	margin: 0 !important;
}

.monday-form-embed-wd .fl-row-content-wrap {
	padding: 0 !important;
}

/* Underlines akismet link */

.akismet_comment_form_privacy_notice a  {
	text-decoration: underline;
}



/* Rows --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* remember to study, compare, and perhaps integrade .row-full-width-wd with row-standard-wd */

.row-full-width-wd .fl-row-content-wrap {
	padding: 40px 60px 40px 60px;
}


.row-full-width-wd .text-maxwidth-wd {
	max-width: 1200px !important;
	margin:0 auto;
}


@media only screen and (max-width: 1001px) {
	.fl-row-content-wrap {
		padding-left: 5px !important; /* gutter */
		padding-right: 5px !important; /* gutter */
}
}





/* not sure this is necessary. being used on the home page in 2 sections and on the climate change workshops page in about 2 sections and on board of directors page */ 

.row-standard-wd .fl-col-content  {
	padding: 30px !important;
}

@media only screen and (max-width: 1400px) {
	.row-standard-wd .fl-col-content {
		padding: 20px !important;
	
	}
}

@media only screen and (max-width: 1001px) {
	.row-standard-wd .fl-col-content {
		padding: 0px !important; /* gutter */
	
	}
}

/* new row colorbox */

.almost-fullwidth-wd .fl-col-content {
	margin-left: 20px !important; /* gutter */
	margin-right: 20px !important; /* gutter */
	margin-top: 30px !important;
}


/* gives all beaver builder rows 20px padding on the sides for breathing room on tablet and mobile */

.fl-row-content-wrap {
	background-color: white;
}

#box-under-header-wd .fl-row-content-wrap {
	margin-top: 20px !important;
}

/* gutter config */


#comments {
	padding: 20px !important;
}

/* this sets default padding for top row of page containing overlapping color boxes underneath */

#page-header-wss-dex .fl-row-content-wrap {
    padding-top: 140px;
    padding-bottom: 180px;
}

/* this sets default padding for top row of page WITHOUT overlapping color boxes underneath. Redundant with the below class */

#page-header-norm-wss-dex .fl-row-content-wrap {
    padding-top: 150px !important;
    padding-bottom: 150px !important;
}

/* this sets default padding for top row of page WITHOUT overlapping color boxes underneath */

.page-header-norm-wss-dex .fl-row-content-wrap {
    padding-top: 150px;
    padding-bottom: 150px;
}


/* not sure when to use this */

#page-header-wss-dex .fl-module-heading .fl-module-content {
	margin: 7px 25px 7px 25px !important; /* gutter */
	
}

.page-header-norm-wss-dex .heading-pageheader-medium-wd .fl-module-content {
	margin-bottom: 10px !important;
}

.page-header-norm-wss-dex .heading-pageheader-large-wd .fl-module-content {
	margin-top: 5px !important;
}

@media only screen and (max-width: 1001px) {
	.page-header-norm-wss-dex .fl-row-content-wrap {
		padding-top: 80px !important;
		padding-bottom: 80px !important;
	}
}

/* this is for any color box that should be medium width - currently not in use - might want to use this in future */

.row-mediumwidth-colorbox-wd .fl-row-content-wrap {
	padding-left: 40px !important;
	padding-right: 40px !important;
	
}

.row-mediumwidth-colorbox-wd .fl-col-content {
    max-width: 950px !important;
	margin-left: auto !important;
	margin-right: auto !important;
    padding-bottom: 20px !important;

}

/* using this on homepage only because for some reason the other one doesn't work well with the slider.  this uses a full width row and applies the effects to the column .fl-builder-content, .fl-builder-edit, .fl-editable */

html:not(.fl-builder-edit) .row-overlapping-box-under-page-header-wd-v2 .fl-row-content {	
	position: relative !important;
	top: -100px !important; 
	z-index: 0 !important;
}

/* for some reason I need to make the padding left and right here 40px in order for it to come out as 30px. ask beaver builder why */




.row-overlapping-box-under-page-header-wd-v2 .fl-row-content-wrap {
	padding-left: 25px !important; /*gutter*/
	padding-right: 25px !important; /*gutter*/
	padding-bottom: 0px;

}

/* used for any rows containing a mediumwdith row (instead of column) */


.row-mediumwidth-wd {
	max-width: 950px;
}

@media only screen and (max-width: 1001px) {
	.row-mediumwidth-withframe-wd .fl-col-content {
		margin-top: 0px !important;
		margin-bottom: 0px !important;
		
	}
	
	.row-mediumwidth-withframe-wd .fl-row-content-wrap {
		padding: 25px !important;
	}
}

/* card for accordion bios */


.row-card2-wd .col-card2-photo-wd .fl-col-content, .row-card2-wd .col-card2-name-wd .fl-col-content {
	padding: 0 !important;
	margin: 0 !important;
}

.col-card2-name-wd .fl-module-content {
	margin-bottom: 0 !important;
}


.row-card2-wd .fl-heading  {
	margin-bottom: 0px !important;
}

.row-card2-wd .fl-module-photo .fl-module-content {
	margin: 15px 20px 10px 20px !important;
}

.row-card2-wd .fl-module-heading .fl-module-content  {
	margin: 0px 20px 10px 20px !important;
}


@media only screen and (max-width: 1001px) {
	.row-card2-wd .fl-photo-content {
		width: 100% !important;
		text-align: left !important;
	}
	.row-card2-wd .fl-heading {
		text-align: center !important;	
	}
	.row-card2-wd .fl-photo-img {
		width: 300px !important;
	}
	
}

/* card for board of director bios */


.row-card-wd .col-card-photo-wd .fl-col-content, .row-card-wd .col-card-name-wd .fl-col-content {
	padding: 0 !important;
	margin: 0 !important;
}




.row-card-wd .fl-heading  {
	margin-bottom: 0px !important;
}

.row-card-wd .fl-module-photo .fl-module-content {
	margin: 15px 20px 10px 20px !important;
}

.row-card-wd .fl-module-heading .fl-module-content  {
	margin: 0px 20px 10px 20px !important;
}


@media only screen and (max-width: 1001px) {
	.row-card-wd .fl-photo-content {
		width: 100% !important;
		text-align: center !important;
	}
	.row-card-wd .fl-heading {
		text-align: center !important;	
	}
	.row-card-wd .fl-photo-img {
		width: 300px !important;
	}
	
}

/* used for any rows containing a mediumwidth column */

.row-mediumwidthcolumn-wd .fl-col-content {
    max-width: 950px !important;
	margin-left: auto !important;
	margin-right: auto !important;
    padding-bottom: 20px !important;
	padding-top: 30px !important;
	
}

@media only screen and (max-width: 1001px) {
	.row-mediumwidthcolumn-wd .fl-col-content  {
		width: 100% !important;
	}
}



/* buttons ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/



#row-3-horizontal-buttons .fl-button-wrap {
    text-align: right;
}


/*  button-wd (deprecating .primary-button-wd - they have same code below) */

.button-wd a, .primary-button-wd a {
	background-color: black !important;
	border: solid !important;
	border-width: 3px 3px 3px 3px !important;
	border-color: black !important;
	border-radius: 0px !important;
	padding: 20px 40px 20px 40px !important;
}

.button-wd a .fl-button-text, .primary-button-wd a .fl-button-text {
	color: white !important;
	font-size: 18px !important;
	line-height: 1.5em !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
}

@media only screen and (max-width: 1001px) {
	.button-wd a .fl-button-text, .primary-button-wd a .fl-button-text {
		font-size: 16px !important;
	}
}
	
@media only screen and (max-width: 1001px) {
	
	.button-wd a, .primary-button-wd a {
	 	padding: 15px 15px !important;
			
	}
}



.button-wd i, .primary-button-wd i {
	color: white !important;
}

	
.button-wd a:hover, .primary-button-wd a:hover, .button-wd .wp-element-button:hover {
	background-color: white !important;	
}

.button-wd a:hover .fl-button-text, .button-wd a:hover i, .primary-button-wd a:hover .fl-button-text, .primary-button-wd a:hover i {
	color: black !important;
}

/* for smaller buttons */


.small-blue-button-wd a {
	background-color: #004369 !important;
	border: solid !important;
	border-width: 3px 3px 3px 3px !important;
	border-color: #004369 !important;
	border-radius: 0px !important;
	padding: 10px 15px 10px 15px !important;
}

.small-blue-button-wd a .fl-button-text {
	color: white !important;
	font-size: 12px !important;
	line-height: 1.5em !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
}

@media only screen and (max-width: 1001px) {
	.small-blue-button-wd a .fl-button-text {
		font-size: 12px !important;
	}
}
	
@media only screen and (max-width: 1001px) {
	
	.small-blue-button-wd a {
	 	padding: 10px 10px !important;
			
	}
}



.small-blue-button-wd i {
	color: white !important;
}

	
.small-blue-button-wd a:hover, .small-blue-button-wd .wp-element-button:hover {
	background-color: white !important;	
}

.small-blue-button-wd a:hover .fl-button-text, .small-blue-button-wd a:hover i {
	color: #004369 !important;
}

.small-button-wd a {
	background-color: black !important;
	border: solid !important;
	border-width: 3px 3px 3px 3px !important;
	border-color: black !important;
	border-radius: 0px !important;
	padding: 10px 15px 10px 15px !important;
}

.small-button-wd a .fl-button-text {
	color: white !important;
	font-size: 12px !important;
	line-height: 1.5em !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
}

@media only screen and (max-width: 1001px) {
	.small-button-wd a .fl-button-text {
		font-size: 12px !important;
	}
}
	
@media only screen and (max-width: 1001px) {
	
	.small-button-wd a {
	 	padding: 10px 10px !important;
			
	}
}



.small-button-wd i {
	color: white !important;
}

	
.small-button-wd a:hover, .small-button-wd .wp-element-button:hover {
	background-color: white !important;	
}

.small-button-wd a:hover .fl-button-text, .small-button-wd a:hover i {
	color: black !important;
}


/* links */

.fl-rich-text a {
	text-decoration: underline;
}

/* styles row-2columns-wd ----------------------------- */
	


/* gutter */
.row-2columns-wd .fl-module-photo .fl-module-content {
		margin: 0px 20px 0px 20px !important; 
}

.row-2columns-wd .fl-module-heading .fl-module-content, .row-2columns-wd .fl-module-rich-text .fl-module-content {
		margin-bottom: 0px !important;
	}

.row-2columns-wd .fl-photo-content, .row-2columns-wd .fl-photo-img  {
	width: 100% !important;
}

.row-2columns-wd .fl-row-content-wrap {
	padding-top: 80px !important;
	padding-bottom: 80px !important;
}

@media only screen and (max-width: 1600px) {
	.row-2columns-wd .fl-row-content-wrap {
	padding-top: 50px !important;
	padding-bottom: 50px !important;
}
}

@media only screen and (max-width: 1001px) {
	.row-2columns-wd .fl-row-content-wrap {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	
	.row-2columns-wd .fl-col-content  {
		width: 100% !important;
		
	}
	
	.row-2columns-wd .fl-col  {
		max-width: none !important;
		
	}
		
	.row-2columns-wd .fl-module-photo .fl-module-content {
		margin-bottom: 0px !important;
	}
	
}





/* styles row-2columns-colorbox-wd ----------------------------- */



/* makes the column color background the right size to align with the standard 2 column row that does not have a color box background */




.row-2columns-colorbox-wd.picright-wd .fl-col:first-child .fl-col-content  {
	margin-left: 20px !important;
	margin-right: 20px !important;
	padding: 20px !important;
	
}





.row-2columns-colorbox-wd.picleft-wd .fl-col:nth-child(2) .fl-col-content  {
	margin-left: 20px !important;
	margin-right: 20px !important;
	padding: 20px !important;
	
}


@media only screen and (max-width: 1001px) {
	.row-2columns-colorbox-wd.picright-wd .fl-col:first-child .fl-col-content {
		margin-left: 20px !important;
		margin-right: 20px !important;
		padding: 0px !important; /* gutter */
	
	}
	.row-2columns-colorbox-wd.picleft-wd .fl-col:nth-child(2) .fl-col-content  {
		margin-left: 20px !important;
		margin-right: 20px !important;
		padding: 0px !important; /* gutter */
	
	}
	
	
}

/* styles quote rows */

.row-quote-wd .fl-heading, .row-quote-wd .fl-module-content, .row-quote-wd i, .row-quote-wd p {
	 margin-bottom: 0px !important;
}

.row-quote-wd .fl-row-content-wrap {
	padding-top: 50px !important;
	padding-bottom: 50px !important;
}








/* ROW COLORBOX ALMOST FULLWIDTH - this is for wide color boxes that stretch almost all the way across the page and are not full width */


.row-colorbox-almostfullwidth-wd .fl-col-content  {
	margin-left: 20px !important;
	margin-right: 20px !important;
	padding: 40px !important;
	
}

.row-colorbox-almostfullwidth-wd .fl-module-heading .fl-module-content {
		margin-bottom: 0px !important;
	}


@media only screen and (max-width: 1400px) {
	.row-colorbox-almostfullwidth-wd .fl-col-content {
		padding: 20px !important;
	
	}
}

@media only screen and (max-width: 1001px) {
	.row-colorbox-almostfullwidth-wd .fl-col-content {
		padding: 10px !important;
	
	}
}

/* this sets default padding for top row of page WITHOUT overlapping color boxes underneath */

/* deprecated, still on early/original bb pages */



#row-with-heading-for-page-section-dex {
    margin-top: 80px;
    margin-bottom: 80px;
}

#row-fixed-width-color-box-dex {
    margin-top: 80px;
    margin-bottom: 80px;
}



/* this styles the box under page headers that overlaps with the page header above it. In documentation */

.row-overlapping-box-under-page-header-wd {
    max-width: 950px;
    margin-top:-50px;
    padding-bottom: 50px;
}

/* best option so far. implementing this globally */

#row-overlapping-page-header-wd {
    margin-top:-50px;
	max-width: 950px;
}


#row-overlapping-page-header-wd .fl-row-content-wrap {
    margin-bottom: 40px;
}


#row-overlapping-page-header-wd p {
	font-size: 22px !important;
	line-height: 1.5em !important;
}




@media only screen and (max-width: 1001px) {
	#row-overlapping-page-header-wd {
		margin-left: 25px !important; /* gutter */
		margin-right: 25px !important; /* gutter */
	}
	
	#row-overlapping-page-header-wd p {
	font-size: 18px !important;
	}
}

/* end of best option so far */

/* consider replaced this ID below with the class above (just to make it a class, not to change code). Also, currently in use on Education page, donation page, and maybe testimonials */

#overlapping-box-under-page-header-wss-dex {
    max-width: 950px;
    margin-top:-50px;
}

/* gutter */

@media only screen and (max-width: 1001px) {
	#overlapping-box-under-page-header-wss-dex {
		margin-left: 25px !important; /*gutter*/
		margin-right: 25px !important; /*gutter*/
	
	}
}


/* this is for boxes of content that are centered, have a max width (not full page width) and have a color background */

#content-box-background-color-max-width-wd {
	max-width: 950px;
}






/* use this to apply a light gray background and border to rows.  For example, rows that have cards on top. Good to use this row between two white rows */
.row-gray-background-color-dex {
    background-color: #FAFBFD;
    border-style: solid;
    border-width: 2px 0px;
    border-color: rgb(231, 233, 236);
}


/* columns --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.column-textoncolor-wd {
	
}






/* deprecating end */

.bold-icon-wd i {
	font-weight: bold !important;
}



/* accent button */

#accent-button-wd a {
	background-color: white !important;
	border: solid !important;
	border-width: 2px !important;	
	border-color: #b4dbdc !important;
	border-radius: 100px 100px 100px 100px !important;
	padding: 20px 40px 20px 40px !important;
}

#accent-button-wd a .fl-button-text {
	color: black !important;
	font-size: 18px !important;
}

#accent-button-wd a:hover {
	background-color: #004369 !important;
	border-color: #b4dbdc !important;	
}

#accent-button-wd a:hover .fl-button-text, #accent-button-wd a:hover i {
	color: #b4dbdc !important;
}

/* ending styles */


.fl-builder .page .entry-header {
    display:none !important;
}



	



/* styles fluentforms labels */

.ff-el-input--label label {
    font-weight: 400 !important;
    font-size: 20px !important;
}

/* styles fluentforms inputs */

input.ff-el-form-control  {
    border-style: solid !important;
    border-color: rgba(180, 219, 220, 1) !important;
    border-width: 2px !important;
    padding-top: 25px !important;
    padding-bottom: 25px !important;
}

textarea.ff-el-form-control  {
    border-style: solid !important;
    border-color: rgba(180, 219, 220, 1) !important;
    border-width: 2px !important;
  
}

/* styles fluentforms submit buttons */

.ff-btn-submit {
    display: block !important;
    width: 100% !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    background-color: #b4dbdc !important;
    font-family: "Open Sans", sans-serif !important; 
    font-size: 20px !important;
    font-weight: 600 !important;
    color: black !important;
}