/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */ 
/*Fonts*/
	/*Custom Fonts*/
		@font-face {font-family: "Hundergad";
			src:  url("/wp-content/themes/bb-theme-child/fonts/Hundergad-Rough.woff") format("woff"),
				  url("/wp-content/themes/bb-theme-child/fonts/Hundergad-Rough.woff2") format("woff2"); font-weight: normal;}

	/*Google Fonts - get embed code from Google Fonts, paste in head code in appearance>customizer*/
		/*Google Font name for this project: "Work Sans"*/

/****
 Design System 
 ****/

/** Typography **/
:root {
  --fontFamilyText: 'Crimson Text';
  --fontFamilyHeadings: 'DM Sans';
  --fontFamilySpecial: 'Crimson Text';
  --fontSizeText: 2rem;
  --fontLineHeightText: 1.25;
  --fontMarginBottomText: 3rem;
	--word-spacing: .5rem;
}

/** Colors **/
:root {
  --colorBodyText: var(--colorBrandBlack);
  --colorHeading1Text: var(--colorBrandBlack);
  --colorHeading2Text: var(--colorBrandBlack);
  --colorHeading3Text: var(--colorBrandBlack);
  --colorHeading4Text: var(--colorBrandBlack);
  --colorHeading5Text: var(--keppel);
  --colorHeading6Text: var(--colorBrandBlack);
  --colorLink: var(--keppel);
  --colorLinkHover: var(--eden);

  --colorButton: var(--sunflower);
  --colorButtonText: white;
  --colorButtonHover: white;
  --colorButtonTextHover: var(--sunflower);
  --colorAccent: var(--eden);
  --colorAccentHover: var(--keppel);

  /*Brand Palette*/
  --colorBrandBlack: #153730;
  --eden: #2a6b5b;
  --keppel: #58b09c;
  --sinbad: #a4d4c9;
  --sunflower: #ffbf00;
  --goldenrod: #b98b00;
}

html {
  font-size: 62.5%;
  /* changes a default 16px font size to 10px */
}
.add-word-space {
  word-spacing: var(--word-spacing);}

.wp-block-quote {
  border-left: 0.5em solid var(--colorAccent);
  margin: 1.75em 3.5em 1.75em 3.5em;
  padding-left: 1.5em;
  font-style: italic;}

.wp-block-pullquote {
  border-bottom: 4px solid var(--colorAccent);
  border-top: 4px solid var(--colorAccent);
  color: currentColor;
  margin-bottom: 1.75em;}

.wp-block-pullquote blockquote,
.wp-block-pullquote cite,
.wp-block-pullquote p {
  color: inherit;
  padding: 0 8rem;
  border-left: none;
  margin: 0;
  font-weight: bold;}

/*Verse*/
pre.wp-block-verse {
  padding: 3rem;}

/* General Headings */
/** h1 **/
h1,
.fl-module-fl-post-content h1 {
  font-family: 'Crimson Text';
  font-weight: bold;
  color: var(--colorHeading1Text);
  line-height: 1;
	margin: 4rem 0 2rem;}

@media (min-width:768px) {

  h1,
  .fl-module-fl-post-content h1 {
    font-size: 6.3rem;}
}

/**h2**/
h2,
.fl-module-fl-post-content h2 {
  font-family: 'Crimson Text';
  font-weight: 600;
 	color: var(--colorHeading2Text);}

@media (min-width:768px) {

  h2,
  .fl-module-fl-post-content h2 {
    line-height: 1.25;
    margin: 2.5rem 0 2rem;
    font-size: 5rem;
  }
}

/**h3**/
h3,
.fl-module-fl-post-content h3 {
  font-family: var(--fontFamilyHeadings);
	color: var(--colorHeading3Text);}

@media (min-width:768px) {

  h3,
  .fl-module-fl-post-content h3 {
    line-height: 1;
    margin: 2.5rem 0 2rem;
    font-size: 3.6rem;
  }
}

/**h4**/
h4,
.fl-module-fl-post-content h4 {
  color: var(--colorHeading4Text);
    font-family: var(--fontFamilyHeadings);
    font-weight: bold;}

@media (min-width:768px) {

  h4,
  .fl-module-fl-post-content h4 {
    line-height: 1;
    margin: 2.5rem 0 2rem;
    font-size: 2.6rem;
  }
}

/**h5**/
h5,
.fl-module-fl-post-content h5 {
  color: var(--colorHeading5Text);
    font-family: var(--fontFamilyHeadings);
}

@media (min-width:768px) {

  h5,
  .fl-module-fl-post-content h5 {
    line-height: 1.25;
    margin: 2.5rem 0 2rem;
    font-size: 2.15rem;
    text-transform: uppercase;
  }
}

/**h6**/
h6,
.fl-module-fl-post-content h6 {
  color: var(--colorHeading6Text);
    font-family: var(--fontFamilyHeadings);
    font-weight: bold;
}

@media (min-width:768px) {

  h6,
  .fl-module-fl-post-content h6 {

    line-height: 1.25;
    letter-spacing: 1px;
    margin: 2.5rem 0 2rem;
    font-size: 1.8rem;
    text-transform: uppercase;
  }
}

/**paragraph and body**/
  p,
  p ul {
    font-family: var(--fontFamilyText);
		font-weight: normal;
    color: var(--colorBodyText);
    font-size: var(--fontSizeText);
    line-height: var(--fontLineHeightText);
    margin-bottom: var(--fontMarginBottomText);}

  body,
  body ul {
    font-family: var(--fontFamilyText);
    font-weight: normal;
    color: var(--colorBodyText);
    font-size: var(--fontSizeText);
    line-height: var(--fontLineHeightText);
    margin-bottom: var(--fontMarginBottomText);}

li strong {font-family: var(--fontFamilyText); font-weight: bold;}

p strong {font-family: var(--fontFamilyText); font-weight: bold;}

p ul {font-family: var(--fontFamilyText);}

body ul {font-family: var(--fontFamilyText);}

u {text-underline-offset: .75rem;}

/***Links Styling***/
.fl-photo a:hover {
  text-decoration: none;
  border: none;}

a {color: var(--colorLink);}

a:hover {color: var(--colorLinkHover);}

.announcement-link:hover {
  font-style: italic;
	text-decoration: underline;
	text-decoration-color: white;}

/**Utilities**/
/*.align-bottom {
display: flex;
justify-content: center;
align-items: flex-end;
flex: 1 1 0;
}*/
.border-left {border-left: 8px solid; margin: 5% 0;}
.keppel {border-color: var(--keppel);}
input.text.text-full[name="class"] {
  font-family: Menlo, monospace;
  font-size: 120%;}

.fl-module-fl-post-content {max-width: 789px;}

.width789 {max-width: 789px;}

.center {margin: 0 auto;}

.z-5 {z-index: 5;}

.z-10 {z-index: 10;}

.relative {position: relative;}

.absolute {position: absolute;}

.sticky-bar {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 50;}

.top-0 {top: 0;}

.height-100p {
  min-height: 100%;
  min-width: auto;}

/** Buttons **/
a.fl-button {
  color: var(--colorButtonText);
  background-color: var(--colorButton);
  border: solid 4px var(--colorButton);
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 1px;}

a.fl-button:hover {
  color: var(--colorButtonTextHover);
  border: solid 4px var(--colorButtonHover);
  background-color: var(--colorButtonHover);}

/** Search Form **/
input[type='search'].pp-search-form__input {
  color: var(--colorLink);
  font-family: var(--fontFamilyText);
  font-weight: 400;
  font-size: var(--fontSizeText);
}