/*
Theme Name: Habitat for Humanity La Crosse
Version: 1.0.1
template: bb-theme
*/

/* global vars */
:root {
   /* colors */
   --hfh-body-font:   #3c3d3e; /* accessible version */
   --hfh-dark-navy:   #032E6B;
   --hfh-light-blue:  #00AFD7;
   --hfh-slate-gray:  #5C818E;
   --hfh-green:       #43B02A; /* #348721 */
   --hfh-red:         #DD4A3D;
   --hfh-orange:      #FF671F;
   --hfh-highlight-1: #C4D600;
   --hfh-highlight-2: #F4E72E;
   /* misc. */
   --hfh-masthead-height: 173px;
   --hfh-block-column-gap: 7px; /* this creates the space (flex column gap) between the blocks in masthead and footer */
}
@media(max-width:1200px) {
   :root {
      --hfh-masthead-height: 143px;
   }
}
@media(max-width:1100px) {
   :root {
      --hfh-masthead-height: 123px;
      --hfh-block-column-gap: 5px;
   }
}
@media(max-width:768px) {
   :root {
      --hfh-masthead-height: 105px;
   }
}

#masthead {
   position: fixed;
   z-index: 9999;
   width: 100%;
   padding: 0;
}
#masthead .pagewidth {
   width: 1600px;
   height: var(--hfh-masthead-height);
   margin: 0 auto;
   display: flex;
   flex-wrap: nowrap;
}
/* extended BG colors left/right */
#masthead::before,
#masthead::after {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   top: 0;
   width: calc((100% - 1600px) / 2);
   height: 100%;
   background: var(--hfh-highlight-1);
}
#masthead::before {
   left: 0;
}
#masthead::after {
   right: 0;
}
#masthead .logo-col {
   flex-basis: 405px;
   position: relative;
   display: flex;
   flex-wrap: nowrap;
   column-gap: var(--hfh-block-column-gap);
}
#masthead .logo-col::before {
   flex: 0 1 60px;
   content: '';
   display: block;
   height: 100%;
   background: var(--hfh-highlight-1);
}
#masthead .logo-col a.logo {
   flex: 1 1 345px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   padding: 0px 55px 0px 50px;
   background: var(--hfh-light-blue);
}

#masthead .nav-col {
   flex-basis: 945px;
   padding: 0 30px 0 50px;
   background: #fff;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}
#masthead .nav-col .row-1 {
   overflow: hidden;
   padding-top: 15px;
   display: flex;
   flex-wrap: nowrap;
   justify-content: flex-start;
}
#masthead .nav-col .row-1 .search-wrap {
   width: calc(100% - 320px);
   position: relative;
   display: flex;
   padding-right: 30px;
}
#masthead .nav-col .row-1 .search-wrap form {
   width: 100%;
}
#masthead .nav-col .row-1 .search-wrap input.searchtext {
   width: 100%;
   margin: 0;
   padding: 5px;
   background: transparent;
   border: none;
   font-size: 18px;
   border-bottom: 1px solid var(--hfh-highlight-1);
   border-radius: 0;
   transform: translateY(-55px);
   -webkit-transition:  .5s;
   transition:          .5s;
}
#masthead .nav-col .row-1 .search-wrap input.searchtext:focus,
#masthead .nav-col .row-1 .search-wrap:hover input.searchtext {
   transform: translateY(0px);
}
#masthead .nav-col .row-1 .search-wrap button.searchsubmit {
   display: block;
   position: absolute;
   top: 2px;
   right: 30px;
   width: 30px;
   height: 30px;
   overflow: hidden;
   font-size: 18px;
   color: #888888;
   margin: 0;
   padding: 5px 5px 0 5px;
   background-color: transparent;
   border: none;
}
#masthead .nav-col .row-1 .top-row-nav {
   display: flex;
   flex-wrap: nowrap;
   justify-content: space-between;
   margin-top: 8px;
   height: 24px;
}
#masthead .nav-col .row-1 .top-row-nav a {
   display: block;
   position: relative;
   padding: 0 30px;
   font-size: 20px;
   color: #000;
   line-height: 1;
}
#masthead .nav-col .row-1 .top-row-nav a::before {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   top: 2px;
   left: 0;
   width: 1px;
   height: 18px;
   background: var(--hfh-highlight-1);
}
#masthead .nav-col .row-1 .top-row-nav a:nth-child(2) {
   padding-right: 0;
}
#masthead .nav-col .row-1 .top-row-nav a:hover {
   text-decoration: none;
   color: var(--hfh-light-blue);
}

#masthead .nav-col .row-2 {
   padding-bottom: 15px;
}
#masthead #main-nav ul {
   margin: 0;
   padding: 0;
   display: flex;
}
#masthead #main-nav ul li {
   position: relative;
   margin: 0;
   padding: 0;
   list-style: none;
}
#masthead #main-nav > ul > li > a {
   display: block;
   line-height: 1;
   color: #000;
   margin: 0;
   padding: 5px 50px 5px 0;
   font-size: 24px;
   font-weight: 300;
   border-bottom: 16px solid transparent;
   -webkit-transition:  .2s;
   transition:          .2s;
}
#masthead #main-nav > ul > li.active > a,
#masthead #main-nav > ul > li > a:hover {
   text-decoration: none;
   color: var(--hfh-light-blue);
   border-bottom-color: var(--hfh-light-blue);
}
/* ReStore link */
#masthead #main-nav ul li.restore > a {
   text-indent: -9999px;
   width: 210px;
   padding-right: 0;
   background: url(assets/images/habitat-restore-logo-b.svg) no-repeat center top;
}
/* drop downs */
#masthead #main-nav > ul > li > ul.sub-menu {
   display: none;
   position: absolute;
   top: 100%;
   left: 0;
   width: 350px;
   background: #eaeaea;
   padding: 30px 0px 10px 0px;
   border-bottom: 15px solid var(--hfh-light-blue);
}
#masthead #main-nav ul li ul li a {
   display: block;
   margin: 0;
   padding: 6px 25px;
   font-size: 20px;
   color: #00232f;
   font-weight: 600;
}
#masthead #main-nav ul li ul li a:hover {
   background: var(--hfh-highlight-1);
   text-decoration: none;
}
#masthead #main-nav ul li ul li ul.sub-menu {
   display: block !important;
}
#masthead #main-nav ul li ul li ul.sub-menu li a {
   display: block;
   margin: 0;
   padding: 6px 25px 6px 40px;
   font-weight: 400;
}
#masthead #main-nav ul li ul li ul.sub-menu li:last-child {
   margin-bottom: 25px;
}
@media(max-height:800px) {
	#masthead #main-nav > ul > li > ul.sub-menu {
		padding-top: 10px;
		padding-bottom: 0px;
	}
	#masthead #main-nav > ul > li > ul.sub-menu:last-child {
		padding-bottom: 10px;
	}
	#masthead #main-nav ul li ul li a,
	#masthead #main-nav ul li ul li ul.sub-menu li a {
		padding-top: 3px;
		padding-bottom: 3px;
		font-size: 18px;
	}
	#masthead #main-nav ul li ul li ul.sub-menu li:last-child {
	   margin-bottom: 0px;
	}
}

/* donate col */
#masthead .donate-col {
   flex-basis: 250px;
   display: flex;
   column-gap: var(--hfh-block-column-gap);
}
#masthead .donate-col a,
#masthead .donate-col button {
   flex: 1 1 140px;
   order: 1;
   text-align: center;
   background: var(--hfh-orange);
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   font-size: 28px;
   color: #fff;
   line-height: 1;
   font-weight: 500;
   -webkit-transition:  .2s;
   transition:          .2s;
}
#masthead .donate-col button.mobile-search-toggle {
   display: none;
   border: none;
   border-radius: 0;
}
#masthead .donate-col button.mobile-search-toggle.open .fa-search::before {
   content: '\f00d'; /* swap search icon with close icon */
}
/* heart icon */
#masthead .donate-col a::before {
   content: '';
   display: block;
   width: 32px;
   height: 32px;
   margin: 0 auto 4px auto;
   background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 62 57"><path d="M61 18.8c.1-9.6-7.7-17.4-17.3-17.5-4.9-.1-9.3 1.9-12.5 5.1C28 3.1 23.6 1 18.7 1 9 .9 1.1 8.6 1 18.2.8 37.8 30.6 56 30.6 56S60.8 38.4 61 18.8z" fill="%23fff"/></svg>');
   background-repeat: no-repeat;
   background-position: center top;
   background-size: contain;
   -webkit-transition:  .2s;
   transition:          .2s;
}
/* blue shape */
#masthead .donate-col::before {
   flex: 1 1 40px;
   order: 2;
   content: '';
   display: block;
   background: var(--hfh-light-blue);
}
/* olive shape */
#masthead .donate-col::after {
   flex: 1 1 70px;
   order: 3;
   content: '';
   display: block;
   background: var(--hfh-highlight-1);
}
#masthead .donate-col a:hover {
   text-decoration: none;
   color: var(--hfh-orange);
   background: var(--hfh-body-font);
}
#masthead .donate-col a:hover::before {
   background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 62 57"><path d="M61 18.8c.1-9.6-7.7-17.4-17.3-17.5-4.9-.1-9.3 1.9-12.5 5.1C28 3.1 23.6 1 18.7 1 9 .9 1.1 8.6 1 18.2.8 37.8 30.6 56 30.6 56S60.8 38.4 61 18.8z" fill="%23FF671F"/></svg>');
}

/* hamburger */
#masthead button.mobile-toggle-flyout {
   flex-basis: 150px;
   display: none;
   border: none;
   background: var(--hfh-highlight-1);
   border-radius: 0;
   text-align: center;
   padding: 45px 40px;
   color: var(--hfh-body-font);
   margin-right: var(--hfh-block-column-gap);
}
#masthead button.mobile-toggle-flyout i {
   font-size: 30px;
}
#masthead button.mobile-toggle-flyout span {
   display: block;
   text-transform: lowercase;
   font-weight: 600;
   font-size: 16px;
}
/* additional row of buttons in header on mobile */
.mobile-sub-nav-row {
   display: none;
   margin-top: var(--hfh-block-column-gap);
}
.mobile-sub-nav-row a {
   display: block;
   width: 50%;
   padding: 5px 0;
   text-align: center;
   font-size: 17px;
   font-weight: 600;
   color: #fff;
}
.mobile-sub-nav-row a:nth-child(1) {
   background: var(--hfh-orange);
}
.mobile-sub-nav-row a:nth-child(2) {
   background: var(--hfh-light-blue);
}
.mobile-sub-nav-row a:hover {
   text-decoration: none;
}

@media(max-width:1600px) {
   #masthead .pagewidth {
      width: 100%;
   }
}
@media(max-width:1500px) {
   #masthead #main-nav > ul > li > a {
      font-size: 22px;
   }
   #masthead #main-nav ul li.restore > a {
      width: 170px;
   }
}
@media(max-width:1400px) {
   #masthead #main-nav > ul > li > a {
      padding-right: 25px;
   }
}
@media(max-width:1300px) {
   #masthead .logo-col a.logo {
      padding: 30px 30px 25px 30px;
   }
   #masthead .nav-col {
      width: calc(100% - 555px);
      padding: 0 30px 0 30px;
   }
   #masthead .donate-col a {
      font-size: 24px;
   }
}
@media(max-width:1200px) {
   #masthead .logo-col::before {
      flex-basis: 30px;
   }
   #masthead .logo-col a.logo {
      padding: 15px 20px 20px 15px;
   }
   #masthead .logo-col a.logo img {
      display: block;
   }
   #masthead #main-nav ul li ul li a {
      padding-top: 3px;
      padding-bottom: 3px;
      font-size: 17px;
   }
   #masthead #main-nav > ul > li > ul.sub-menu {
      width: 300px;
      padding-top: 10px;
   }
   #masthead #main-nav ul li ul li ul.sub-menu li:last-child {
      margin-bottom: 10px;
   }
   #masthead #main-nav ul li ul li ul.sub-menu li a {
      padding: 3px 25px 3px 35px;
   }
   #masthead .nav-col .row-2 {
      padding-bottom: 0px;
   }
}
@media(max-width:1100px) {
   /* removed fixed masthead and remove top padding */
   #fl-main-content {
      padding-top: 5px;
   }
   #masthead {
      position: relative;
   }
   #masthead .nav-col .row-1 {
      padding-top: 5px;
   }
   #masthead .nav-col .row-1 .search-wrap {
      width: calc(100% - 250px);
   }
   #masthead .nav-col .row-1 .top-row-nav {
      width: 250px;
   }
   #masthead .nav-col .row-1 .top-row-nav a {
      font-size: 18px;
      padding: 0 15px;
   }
   #masthead .nav-col .row-1 .top-row-nav a:last-child {
      padding-right: 0;
   }
   #masthead #main-nav > ul > li > a {
      font-size: 18px;
   }
   #masthead .donate-col {
      width: 200px;
   }
   #masthead .donate-col::before {
      display: none; /* hide blue box */
   }
   #masthead .donate-col::after {
      flex-basis: 30px;
   }
}
@media(max-width:992px) {
   #masthead .nav-col .row-1 {
      padding-bottom: 30px;
   }
   #masthead .nav-col .row-1 .search-wrap input.searchtext {
      transform: translateY(0);
   }
   #masthead #main-nav > ul > li > a {
      border-width: 8px;
   }
   #masthead .nav-col {
      padding-left: 15px;
      padding-right: 15px;
   }
   #masthead .donate-col a {
      font-size: 17px;
   }
}
@media(max-width:900px) {
   /* drop the donate button, convert for hamburger menu, etc. */
   #masthead .logo-col {
      flex-basis: 505px;
   }
   #masthead .nav-col {
      flex-basis: 845px;
   }
   #masthead .nav-col .row-1 .search-wrap {
      padding-right: 0;
   }
   #masthead .nav-col .row-2 {
      display: none;
   }
   #masthead .nav-col .row-1 .search-wrap {
      width: 100%;
   }
   #masthead .nav-col .row-1 .search-wrap button.searchsubmit {
      right: 0;
   }
   #masthead .donate-col::after {
      display: none;
   }
   #masthead button.mobile-toggle-flyout {
      display: block;
   }
}
@media(max-width:768px) {
   #masthead .logo-col {
      margin-right: var(--hfh-block-column-gap);
   }
   #masthead .logo-col a.logo {
      flex-grow: 4;
   }
   #masthead .logo-col a.logo img {
      width: 160px;
      height: auto;
   }
   #masthead .nav-col {
      display: none;
      position: fixed;
      width: 88%;
      height: 105px;
   }
   #masthead .nav-col .search-wrap {
      padding-top: 30px;
   }
   #masthead .nav-col .row-1 .search-wrap button.searchsubmit {
      top: 30px;
   }
   #masthead .nav-col .top-row-nav {
      display: none !important;
   }
   #masthead .nav-col .row-1 .search-wrap {
      background: #fff;
      padding-right: 0px;
   }
   #masthead .nav-col .row-1 .search-wrap input.searchtext {
      transform: translateY(0);
   }
   .mobile-sub-nav-row {
      display: flex;
   }
   #masthead .donate-col {
      flex-basis: 100px;
   }
   /* swap the donate with the search toggle */
   #masthead .donate-col a {
      display: none;
   }
   #masthead button.mobile-toggle-flyout {
      padding-top: 40px;
   }
   #masthead .donate-col button.mobile-search-toggle {
      display: block;
      padding-top: 30px;
   }
}
@media(max-width:600px) {
   #masthead .nav-col {
      width: 84%;
   }
}

/* misc. helpers */
.fl-page {
   overflow: hidden;
}
@media(max-width:768px) {
   .drop-br br {
      display: none;
   }
}
#fl-main-content p {
   margin: 0 0 20px 0;
}
#fl-main-content .fl-module-rich-text ol li,
#fl-main-content .fl-module-rich-text ul li {
   margin: 0 0 15px 0;
}
.pad-left-1400 .fl-col-content {
   padding-left: calc((100vw - 1400px) / 2);
}
.pad-right-1400 .fl-col-content {
   padding-right: calc((100vw - 1400px) / 2);
}
.pad-left-1600 .fl-col-content {
   padding-left: calc((100vw - 1600px) / 2);
}
.pad-right-1600 .fl-col-content {
   padding-right: calc((100vw - 1600px) / 2);
}

/* blog archive */
.archive-entry {
   position: relative;
   padding-bottom: 70px;
}
.archive-entry .fl-post-grid-meta {
   margin: 0 0 20px 0;
}
.archive-entry a.fl-post-grid-more {
   display: block;
   position: absolute;
   right: 0;
   bottom: 0;
   width: 140px;
   padding: 25px 10px 50px 10px;
   background: var(--hfh-green);
   color: #fff;
   text-align: center;
   text-transform: lowercase;
   font-weight: 600;
}
.archive-entry a.fl-post-grid-more::after {
   content: '';
   display: block;
   position: absolute;
   width: 55px;
   height: 20px;
   bottom: 20px;
   right: 23px;
   background: url(assets/images/icon-nail-w.svg) no-repeat center center;
   background-size: 100% auto;
}
.archive-entry a.fl-post-grid-more:hover {
   background: var(--hfh-body-font);
}

/* event archives */
.em-events-list .em-event {
   display: flex;
   flex-wrap: nowrap;
   flex-direction: row-reverse;
   margin: 0 0 50px 0;
}
.em-events-list .em-event .em-item-image {
   width: 28%;
}
.em-events-list .em-event .em-item-info {
   width: 72%;
   padding: 0 50px 0 0;
}
.em-events-list .em-event .em-item-info h3 {
   font-size: 36px;
}
.em-events-list .em-event .em-item-info .em-event-meta {
   margin: 0 0 15px 0;
}
.em-events-list .em-event .em-item-info .em-item-desc {
   margin: 0 0 15px 0;
}
.em-events-list .em-event .em-item-info a.em-item-read-more {
   background: none;
   color: var(--hfh-light-blue);
   font-weight: 400;
   text-transform: none;
}
@media(max-width:768px) {
   .em-events-list .em-event {
      display: block;
   }
   .em-events-list .em-event .em-item-image {
      width: 100%;
   }
   .em-events-list .em-event .em-item-info {
      width: 100%;
      padding: 0;
   }
}

/* used when a row need to cover a previous row */
.bring-to-top {
   position: relative;
   z-index: 10;
}

/* placing buttons in corners of columns, etc. */
.button-position {
   position: relative;
}
.button-position .fl-module-button {
   display: block;
   position: absolute;
}
.button-position .fl-module-button > .fl-module-content {
   margin: 0 !important;
}
body.fl-builder-edit .button-position .fl-module-button {
   position: static; /* remove absolute while editing */
}
.button-position.right-bottom .fl-module-button {
   right: 0;
   bottom: 0;
}

/* callouts on about page */
.cta-1-title-col {
   position: relative;
}
.cta-1-title-col .fl-col-content::before {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   bottom: 0;
   right: 0;
   width: calc(100% - 60px);
   height: 40px;
   background: #e5eaf0;
}
@media(max-width:768px) {
   .layout-style-2 {
      background: #edf3b2;
   }
}

/* team */
.pp-member-social-icons li a {
	height: 0 !important; 
}

/* gravity forms */
/* volunteer application available weekday times */
select.gfield_select {
   display: block;
   background: #fcfcfc;
   border: 1px solid #e6e6e6;
   border-radius: 4px;
   padding: 9px !important;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%234d4d4f'><polygon points='0,0 100,0 50,50'/></svg>");
   background-repeat: no-repeat;
   background-position: right 10px top 15px;
   background-size: 12px auto;
}

/* content box module (same module used various ways) */
.ds-content-box {
   position: relative;
}

/* partner family stories */
.family-story .ds-content-box h3 {
   color: #fff;
   font-size: 36px;
   text-transform: lowercase;
   margin: 0;
   padding: 20px 60px 15px 20px;
   border-left: 28px solid var(--hfh-highlight-1);
}
.family-story .ds-content-box .dbox-image {
   height: 250px;
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;
   border-left: 42px solid #000;
}
.family-story .ds-content-box .dbox-content {
   padding: 20px 30px 45px 30px;
   background: #dee6e8;
}
.family-story .ds-content-box a.fl-button {
   position: absolute;
   right: 35px;
   bottom: -20px;
   margin: -13px 0 0 0;
   padding: 9px 50px;
}

/* callout style 2 */
.callout-1 .pp-info-banner-inner {
   position: relative;
   min-height: 220px;
}
.callout-1 .pp-info-banner-content {
   overflow: visible !important;
}
.callout-1 .pp-info-banner-content .info-banner-wrap {
   position: static !important;
   display: block !important;
   vertical-align: top !important;
}
.callout-1 .pp-info-banner-inner .banner-title {
   width: 290px;
   position: absolute;
   top: -15px;
   left: -40px;
   color: #fff;
   text-align: right;
   font-size: 30px;
   line-height: 1.3;
   font-family: "neue-haas-grotesk-display", Arial, sans-serif;
   font-weight: 600;
   background: var(--hfh-dark-navy);
}
.callout-1 .pp-info-banner-inner a.banner-button {
   display: block;
   width: 220px;
   position: absolute;
   left: 50%;
   bottom: 0;
}
.callout-1 .pp-info-banner-inner img.pp-info-banner-img {
   width: 360px !important;
   display: block;
   position: absolute;
   right: 0;
   bottom: 0;
   border-right: 25px solid var(--hfh-dark-navy);
}
/* colors */
.callout-1.orange .pp-info-banner-inner .banner-title {
   background: var(--hfh-orange);
}
.callout-1.orange .pp-info-banner-inner img.pp-info-banner-img {
   border-color: var(--hfh-orange);
}
.callout-1.red .pp-info-banner-inner .banner-title {
   background: #ca2319;
}
.callout-1.red .pp-info-banner-inner img.pp-info-banner-img {
   border-color: #ca2319;
}
.callout-1.light-blue .pp-info-banner-inner .banner-title {
   background: var(--hfh-light-blue);
}
.callout-1.light-blue .pp-info-banner-inner img.pp-info-banner-img {
   border-color: var(--hfh-light-blue);
}
.callout-1.green .pp-info-banner-inner .banner-title {
   background: var(--hfh-green);
}
.callout-1.green .pp-info-banner-inner img.pp-info-banner-img {
   border-color: var(--hfh-green);
}
.callout-1.deep-red .pp-info-banner-inner .banner-title {
   background: #a4343a;
}
.callout-1.deep-red .pp-info-banner-inner img.pp-info-banner-img {
   border-color: #a4343a;
}
.callout-1.slate .pp-info-banner-inner .banner-title {
   background: #5c818e;
}
.callout-1.slate .pp-info-banner-inner img.pp-info-banner-img {
   border-color: #5c818e;
}
@media(max-width:1400px) {
   .callout-1 .pp-info-banner-inner a.banner-button {
      left: 400px;
   }
}
@media(max-width:1200px) {
   .callout-1 .pp-info-banner-inner .banner-title {
      position: relative;
      width: 100%;
      top: 0;
      left: 0;
      text-align: left;
      padding: 20px !important;
   }
   .callout-1 .pp-info-banner-inner .banner-title br {
      display: none;
   }
   .callout-1 .pp-info-banner-inner a.banner-button {
      left: 30px !important;
   }
   .callout-1 .pp-info-banner-inner img.pp-info-banner-img {
      border: none;
   }
}
@media(max-width:900px) {
   .callout-1 .pp-info-banner-content .banner-description {
      padding-right: 300px !important;
   }
   .callout-1 .pp-info-banner-inner img.pp-info-banner-img {
      width: 280px !important;
   }
}
@media(max-width:700px) {
   .callout-1 .pp-info-banner-inner img.pp-info-banner-img {
      position: static;
      width: 100% !important;
      height: auto !important;
   }
   .callout-1 .pp-info-banner-content .banner-description {
      padding-right: 20px !important;
   }
}

/* search page fix */
.fl-post-feed-post.fl-post-feed-image-beside, 
.fl-post-feed-post.fl-post-feed-image-beside-content, 
.fl-post-feed-post.fl-post-feed-image-beside-right, 
.fl-post-feed-post.fl-post-feed-image-beside-content-right {
   max-width: 100% !important;
}

/* interior pages */
body.fl-builder-edit .hide-while-editing * {
   display: none;
}

#page-title-row {
   padding-top: 180px;
   position: relative;
}
#page-title-row .title-col .page-title {
   position: relative;
   padding: 40px 30px 1px 60px;
   background: var(--hfh-dark-navy) url(assets/images/blueprint.png) no-repeat center center;
   background-size: cover;
}
#page-title-row .title-col .page-title::before {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   top: 0;
   left: calc(((100vw - 1600px) / 2) * -1);
   width: calc((100vw - 1600px) / 2);
   height: 100%;
   background: var(--hfh-light-blue);
}
#page-title-row .image-col {
   position: relative;
}
#page-title-row .image-col::before {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   bottom: 0;
   left: 0;
   width: 0;
   height: 0;
   border-bottom: 55px solid #fff;
   border-right: 600px solid transparent;
}
/* full width (no image) */
#page-title-row.full-width .title-col .page-title::after {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   top: 0;
   right: calc(((100vw - 1600px) / 2) * -1);
   width: calc((100vw - 1600px) / 2);
   height: 100%;
   background: var(--hfh-light-blue);
}
@media(max-width:1200px) {
   #page-title-row {
      padding-top: 150px;
   }
   #page-title-row .title-col .page-title {
      padding: 40px 30px 0 20px;
   }
   #page-title-row .image-col::before {
      border-bottom-width: 35px;
      border-right-width: 340px;
   }
}
@media(max-width:1100px) {
   #page-title-row {
      padding-top: 0;
   }
}
@media(max-width:700px) {
   #page-title-row .title-col .page-title {
      padding-top: 20px;
   }
}


/* home page */

/* hero and sub-hero */
#home-hero {
   position: relative;
}
#home-hero > .fl-row-content-wrap {
   background-size: auto calc(100% - 180px);
   background-position: right calc((100vw - 1600px) / 2) top 180px;
}
@media(min-width:2000px) {
   .hero-intro-col {
      width: 40% !important;
   }
   .hero-image-col {
      width: 60% !important;
   }
}
@media(max-width:1200px) {
   #home-hero > .fl-row-content-wrap {
      background-size: auto calc(100% - 150px);
      background-position: right 0px top 150px;
   }
}
@media(max-width:1100px) {
   #home-hero .hero-intro-col > .fl-col-content {
      background: #00222e !important;
   }
   #home-hero .hero-intro-col .fl-col-content {
      background-position: top -100px right 0px;
      margin-top: 0;
      padding-top: 30px;
   }
   #home-hero > .fl-row-content-wrap {
      background-size: auto 100%;
      background-position: right 0px top 0px;
   }
}
@media(max-width:600px) {
   #home-hero .hero-intro-col h2 {
      font-size: 40px;
   }
   #home-hero .hero-intro-col p {
      font-size: 20px;
   }
}
@media(max-width:600px) {
   #home-hero .hero-intro-col h2 {
      font-size: 34px;
   }
   #home-hero .hero-intro-col p {
      font-size: 18px;
   }
}

#team-habitat-row .content-col > .fl-col-content {
   padding-right: calc((100vw - 900px) / 2);
}
@media(max-width:1500px) {
   #team-habitat-row .content-col > .fl-col-content {
      padding-right: 100px;
   }
   #team-habitat-row .content-col > .fl-col-content .drop-br br {
      display: none;
   }
}
@media(max-width:1100px) {
   #team-habitat-row .content-col > .fl-col-content {
      padding-right: 0px;
   }
}
@media(max-width:600px) {
   #team-habitat-row .content-col p {
      font-size: 20px !important;
   }
}

/* hone characters section */
#characters-row {
   overflow: hidden;
}
#characters-row .fl-col-group .fl-col .fl-photo-content {
   width: 100%;
   height: 380px;
   position: relative;
}
#characters-row .fl-col-group .fl-col img {
   display: block;
   position: absolute;
}
#characters-row .build-col img {
   width: calc(100% + 40px) !important;
   max-width: calc(100% + 40px) !important;
   left: -10px;
   bottom: -110px;
   z-index: 1;
}
#characters-row .homeownership-col img {
   width: calc(100% + 10px) !important;
   max-width: calc(100% + 10px) !important;
   left: -10px;
   bottom: -65px;
   z-index: 5;
}
#characters-row .renew-col img {
   width: calc(100% + 60px) !important;
   max-width: calc(100% + 60px) !important;
   left: -50px;
   bottom: -80px;
   z-index: 3;
}
#characters-row .repair-col img {
   width: calc(100% + 20px) !important;
   max-width: calc(100% + 20px) !important;
   left: -5px;
   bottom: -25px;
   z-index: 3;
}
#characters-row .reuse-col img {
   width: calc(100% + 50px) !important;
   max-width: calc(100% + 50px) !important;
   left: -50px;
   bottom: -55px;
   z-index: 2;
}
#character-titles-row {
   position: relative;
   z-index: 10;
}
@media(max-width:1200px) {
   #characters-row .fl-col-group .fl-col .fl-photo-content {
      height: 320px !important;
   }
   #characters-row .team-col {
      height: 320px !important;
   }
}
@media(max-width:1000px) {
   #character-titles-row h2 {
      font-size: 40px !important;
   }
}
@media(max-width:900px) {
   #character-titles-row h2 {
      font-size: 34px !important;
   }
}
@media(max-width:768px) {
   #characters-row .fl-node-ljk706irq4eg {
      flex-wrap: nowrap !important; /* characters parent column */
   }
   #characters-row .team-col,
   #characters-row .fl-col-group .fl-col .fl-photo-content,
   #characters-row .team-col .fl-col-content {
      height: 25vw !important;
      min-height: 25vw !important;
   }
   #character-titles-row .fl-node-kyf5pnq6tsdj {
      flex-wrap: nowrap !important; /* character titles parent column */
   }
}
@media(max-width:600px)  {
   #characters-row .build-col img {
      bottom: -80px;
   }
   #characters-row .homeownership-col img {
      bottom: -40px;
   }
   #character-titles-row .fl-node-kyf5pnq6tsdj * {
      display: none;
   }
}
@media(max-width:500px) {
   #characters-row h2 {
      font-size: 34px !important;
   }
}

/* programs */
.nail-button a.fl-button,
.program-box a.fl-button {
   position: relative;
}
.nail-button a.fl-button::after,
.program-box a.fl-button::after {
   content: '';
   display: block;
   position: absolute;
   width: 55px;
   height: 20px;
   bottom: 20px;
   right: 23px;
   background: url(assets/images/icon-nail-w.svg) no-repeat center center;
   background-size: 100% auto;
}
.program-box a.fl-button {
   max-width: 150px;
}
@media(max-width:1300px) {
   .program-box h2 {
      font-size: 40px !important;
   }
}
@media(max-width:1200px) {
   .program-box h2 {
      font-size: 30px !important;
   }
}
@media(max-width:992px) {
   .program-box a.fl-button {
      float: right;
   }
}
@media(max-width:768px) {
   .program-box h2 {
      font-size: 24px !important;
   }
}

/* ReStore section */
#restore-row .restore-img {
   position: relative;
}
#restore-row .restore-img img {
   display: block;
   transform: scale(1.3);
   transform-origin: top right;
}
.restore-button-group .fl-button-group-button {
   width: 33%;
}
.restore-button-group .fl-button-group-button * {
   width: 100%;
}
.restore-center-col {
   position: relative;
}
.restore-center-col a.fl-button,
.restore-center-col a.fl-button:active {
   display: block;
   position: absolute;
   top: 0;
   right: 0;
}
body.fl-builder-edit .restore-center-col a.fl-button {
   position: static;
}
@media(max-width:1500px) {
   #restore-buttons-row {
      margin-right: 20px;
   }
}
@media(max-width:768px) {
   #restore-buttons-row {
      margin-right: 0px;
   }
   #restore-row .restore-img img {
      transform: scale(1);
   }
   .restore-button-group .fl-button-group-button {
      width: 100% !important;
   }
}

/* homepage featured event */
.home-event-featured a.thumb {
   display: block;
   height: 330px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   border-bottom: 10px solid var(--hfh-highlight-1);
}
.home-event-featured .event-info {
   padding: 20px 100px 25px 40px;
   color: #3c3d3e;
}
.home-event-featured .event-info .event-date-month-day {
   font-size: 46px;
   font-weight: 600;
   color: var(--hfh-light-blue);
   line-height: 1.2;
}
.home-event-featured .event-info .event-date-year {
   font-size: 24px;
   line-height: 1;
   color: var(--hfh-light-blue);
}
.home-event-featured .event-info h3 {
   font-size: 30px;
}
.home-event-featured .event-info h3 a:hover {
   color: var(--hfh-light-blue);
}
.home-event-featured a.fl-button {
   width: 100%;
   text-align: center;
   padding-top: 8px !important;
   padding-bottom: 8px !important;
}
@media(max-width:768px) {
   .home-event-featured .event-info .event-date-month-day {
      font-size: 30px;
   }
}
@media(max-width:600px) {
   .home-event-featured .event-info {
      padding: 40px 0px 25px 0px;
   }
   .home-event-featured .event-info h3 {
      font-size: 25px;
   }
}

/* homepage continued events column */
.home-events-older {
   margin-bottom: 20px;
   position: relative;
   display: flex;
   flex-wrap: nowrap;
}
.home-events-older a.thumb {
   display: block;
   width: 30%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
}
.home-events-older .event-info {
   width: 70%;
   margin: 0 0 0 7px;
   padding: 15px 20px 20px 20px;
   background: #f3f3f3;
}
.home-events-older:nth-child(2) .event-info {
   background: #f9fbe5;
}
.home-events-older .event-info .event-date-month-day {
   font-size: 30px;
   font-weight: 600;
   color: #3c3d3e;
   line-height: 1.1;
   text-align: right;
}
.home-events-older .event-info .event-date-month-day span.event-date-year {
   display: block;
   font-weight: 400;
   font-size: 24px;
   text-align: right;
   line-height: 1;
   color: #3c3d3e;
}
.home-events-older .event-info h3 {
   font-size: 24px;
   margin: 0 0 10px 0;
   padding-right: 180px;
}
.home-events-older .event-info h3 a:hover {
   color: var(--hfh-light-blue);
}
.home-events-older .event-info .event-excerpt {
   font-size: 18px;
   line-height: 1.3;
   padding-right: 180px;
   color: #3c3d3e;
}
.home-events-older a.fl-button {
   position: absolute;
   right: 0;
   bottom: 0;
   padding: 35px 20px;
}
@media(max-width:1200px) {
   .home-events-older .event-info h3 {
      margin-top: -50px;
   }
}
@media(max-width:992px) {
   .home-events-older {
      min-height: 180px;
   }
}
@media(max-width:768px) {
   .home-events-older .event-info .event-excerpt {
      padding-right: 120px;
   }
}
@media(max-width:600px) {
   .home-events-older a.thumb {
      width: 40%;
   }
   .home-events-older .event-info {
      width: 60%;
      background: none !important;
      padding-right: 0;
      padding-bottom: 50px;
   }
   .home-events-older .event-info::after {
      content: '';
      display: block;
      position: absolute;
      top: 50px;
      left: calc(40% + 5px);
      width: 100%;
      height: calc(100% - 85px);
      background: #f3f3f3;
   }
   .home-events-older a.thumb {
      margin: 30px 0 0px 0;
   }
   .home-events-older .event-info .event-date-month-day {
      font-size: 24px;
      margin-bottom: 15px;
   }
   .home-events-older .event-info .event-date-month-day span.event-date-year {
      display: inline-block;
      font-size: 18px;
      padding-left: 5px;
   }
   .home-events-older .event-info h3 {
      margin-top: 0px;
      padding-right: 0;
      position: relative;
      z-index: 1;
      font-size: 22px;
   }
   .home-events-older .event-info .event-excerpt {
      padding-right: 0px;
      position: relative;
      z-index: 1;
   }
   .home-events-older a.fl-button {
      padding: 8px 40px;
      right: -20px;
   }
}

/* ways to support us */
.support-title-col {
   position: relative;
}
/* partial vertical borders */
.support-title-col::before,
.support-icon-col:last-of-type::before {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   right: 0;
   width: 10px;
   height: 155px;
   background: var(--hfh-highlight-1);
}
.support-icon-col {
   position: relative;
}
.support-title-col::before {
   top: -40px;
}
.support-icon-col:last-of-type::before {
   bottom: -40px;
}
.support-icon-col img {
   display: block;
   -webkit-transition:  .3s;
   transition:          .3s;
}
.support-icon-col a {
   display: block;
   position: relative;
}
.support-icon-col img {
   border-radius: 50%;
}
.support-icon-col:hover img {
   transform: scale(1.2);
   -webkit-box-shadow: 0px 10px 10px 10px #000000;
   box-shadow: 0px 10px 10px 10px #000000;
}
@media(max-width:1300px) {
   #support .fl-col-group .fl-col:nth-child(2) > .fl-col-content {
      padding-left: 0px !important;
   }
   #support .fl-col-group .fl-col:nth-child(4) > .fl-col-content {
      padding-right: 0px !important;
   }
}
@media(max-width:992px) {
   #support h2 {
      width: 50%;
      padding-right: 20px !important;
   }
   .support-title-col::before {
      height: 120px;
      right: 50%;
   }
   .support-icon-col:last-of-type::before {
      bottom: -80px;
      height: 50px;
   }
}
@media(max-width:768px) {
   .support-icon-col {
      width: 30% !important;
      display: inline-block;
   }
}
@media(max-width:550px) {
   #support h2 {
      width: 70%;
      font-size: 36px !important;
   }
   .support-title-col::before {
      right: 30%;
   }
   .support-icon-col:last-of-type::before {
      right: 30px;
   }}

/* full-width padding fix */
#latest-news .fl-col-group .fl-col:nth-child(1) .fl-col-content {
   padding-left: calc((100vw - 1400px) / 2);
}
#latest-news .fl-col-group .fl-col:nth-child(2) .fl-module-post-grid {
   background: #f9fbe5;
   padding-right: calc((100vw - 1400px) / 2);
}
/* featured post (left col) */
#latest-news .feature-post {
   display: flex;
   flex-wrap: nowrap;
}
#latest-news .feature-post .thumb {
   width: 60%;
}
#latest-news .feature-post .thumb img {
   display: block;
   border-top: 10px solid var(--hfh-highlight-1);
}
#latest-news .feature-post .post-info {
   position: relative;
   width: 40%;
   padding: 0 0 50px 30px;
}
#latest-news .feature-post .post-info h3 {
   font-size: 30px;
   color: var(--hfh-body-font);
   margin: 30px 0 50px 0;
   line-height: 1;
}
#latest-news .feature-post .post-info h3 a:hover {
   color: var(--hfh-light-blue);
}
#latest-news .feature-post .post-info .date {
   color: var(--hfh-light-blue);
   font-size: 18px;
}
#latest-news .feature-post .post-info a.fl-button {
   position: absolute;
   left: 30px;
   bottom: 0;
   width: 235px;
   text-align: center;
   padding: 8px 0;
}
@media(max-width:768px) {
   #latest-news .feature-post .thumb {
      width: 36%;
   }
   #latest-news .feature-post .post-info h3 {
      margin: 10px 0 20px 0;
   }
   #latest-news .feature-post .post-info {
      width: 64%;
   }
}
@media(max-width:768px) {
   #latest-news .feature-post {
      display: block;
   }
   #latest-news .feature-post .thumb {
      width: 100%;
   }
   #latest-news .feature-post .post-info {
      width: 100%;
      padding: 20px 20px 0px 20px;
   }
   #latest-news .feature-post .post-info a.fl-button {
      position: static;
   }
}

/* older posts (right col) */
#latest-news .news-older-col .fl-module-post-grid {
   padding: 50px 0 0px 20px;
}
#latest-news .fl-post-feed-post {
   border: none;
}
#latest-news .older-post {
   display: flex;
   flex-wrap: nowrap;
}
#latest-news .older-post {
   margin: 0 0 30px 0;
}
#latest-news .older-post .thumb {
   width: 30%;
   margin-top: 4px;
}
#latest-news .older-post .thumb img {
   width: 100%;
   height: auto;
}
#latest-news .older-post .post-info {
   width: 70%;
   padding: 0 0 0 20px;
}
#latest-news .older-post .post-info h3 {
   margin: 0 0 10px 0;
   font-size: 24px;
}
#latest-news .older-post .post-info h3 a:hover {
   color: var(--hfh-light-blue);
}
#latest-news .older-post .post-info .excerpt p {
   font-size: 18px;
   line-height: 1.1;
   margin: 0 0 5px 0;
}
#latest-news .older-post .post-info .more-link a {
   font-size: 18px;
   font-weight: 600;
   text-transform: lowercase;
   text-decoration: underline;
}
#latest-news .fl-col-content .fl-module-button {
   background: #f9fbe5;
}

/* sponsors carousel */
@media(max-width:1400px) {
   #sponsors button.logo-slider-prev {
      left: -30px !important;
   }
   #sponsors button.logo-slider-next {
      right: -30px !important;
   }
}
@media(min-width:992px) and (max-width:1200px) {
   #sponsors button.logo-slider-prev {
      top: 120px !important;
      left: calc(50% - 130px) !important;
   }
   #sponsors button.logo-slider-next {
      top: 120px !important;
      right: calc(50% + 0px) !important;
   }
}
@media(max-width:500px) {
   #sponsors {
      padding-bottom: 40px !important;
   }
   #sponsors button.logo-slider-prev {
      top: 120px !important;
      left: calc(50% - 70px) !important;
   }
   #sponsors button.logo-slider-next {
      top: 120px !important;
      right: calc(50% - 60px) !important;
   }
}

/* footer */
#news-signup-row > .fl-row-content-wrap {
   background-size: 450px auto !important;
   background-position: -50px center !important;
}
.newsletter-signup form {
   display: flex;
   flex-wrap: nowrap;
}
.newsletter-signup .gform-body {
   width: calc(100% - 170px) !important;
}
.newsletter-signup .gform-body .gform_fields .gfield {
   margin-right: 10px;
}
.newsletter-signup .gform-body .gform_fields .gfield:last-of-type {
   margin-right: 25px;
}
.newsletter-signup .gform_footer {
   width: 170px !important;
   margin: 0 !important;
   padding: 0 !important;
}
@media(max-width:992px) {
   #news-signup-row input[type="submit"] {
      padding-top: 12px !important;
      padding-bottom: 13px !important;
   }
}
@media(max-width:768px) {
   .newsletter-signup form {
      display: block;
   }
   .newsletter-signup .gform-body .gform_fields .gfield {
      margin-right: 0px !important;
   }
   .newsletter-signup .gform_footer {
      margin-top: 15px !important;
   }
}

/* main footer */

/* extended BG colors left/right */
#main-footer-row {
   position: relative;
}
#main-footer-row::before,
#main-footer-row::after {
   content: '';
   display: block;
   position: absolute;
   z-index: 1;
   top: 0;
   width: calc((100% - 1600px) / 2);
   height: 100%;
   background: var(--hfh-light-blue);
}
#main-footer-row::before {
   left: 0;
}
#main-footer-row::after {
   right: 0;
}
/* first two cols are actually part of the same dark gray area with the logo */
#main-footer-row .footer-col-1 {
   width: 30% !important;
}
#main-footer-row .footer-col-2 {
   width: 20% !important;
}
#main-footer-row .footer-col-3 {
   width: 22% !important;
}
#main-footer-row .footer-col-4 {
   width: 22% !important;
}
#main-footer-row .footer-col-5 {
   width: 6% !important;
}
@media(max-width:1500px) {
   #main-footer-row .footer-col-1 > .fl-col-content {
      padding-left: 30px;
      padding-right: 30px;
   }
   #main-footer-row .footer-col-3 > .fl-col-content {
      padding-left: 30px;
      padding-right: 30px;
   }
}
@media(max-width:1300px) {
   #main-footer-row .footer-col-1 {
      width: 25% !important;
   }
   #main-footer-row .footer-col-1 > .fl-col-content {
      padding-left: 20px;
      padding-right: 0px;
   }
   #main-footer-row .footer-col-2 {
      width: 25% !important;
   }
}
@media(max-width:1100px) {
   #main-footer-row .footer-col-1 > .fl-col-content {
      padding-left: 0px;
      padding-right: 0px;
   }
   #main-footer-row .footer-col-3 > .fl-col-content {
      padding-left: 0px;
      padding-right: 0px;
   }
   #main-footer-row .footer-col-4 > .fl-col-content {
      padding-left: 0px;
      padding-right: 0px;
   }
}
@media(max-width:768px) {
   #main-footer-row .footer-col-1 {
      width: 100% !important;
   }
   #main-footer-row .footer-col-1 img {
      display: block;
      margin-left: -20px !important;
   }
   #main-footer-row .footer-col-2 {
      width: 100% !important;
   }
   /* nudge address text to line up with logo text */
   #main-footer-row .footer-col-2 .fl-module {
      margin-left: calc(50% - 45px) !important;
   }
   #main-footer-row .footer-col-3 {
      width: 50% !important;
   }
   #main-footer-row .footer-col-4 {
      width: 50% !important;
   }
   #main-footer-row .footer-col-5 {
      display: none;
   }
}
@media(max-width:400px) {
   #main-footer-row .footer-col-1 img {
      width: 200px;
      margin-left: -20px !important;
   }
   #main-footer-row .footer-col-2 .fl-module {
      margin-left: calc(50% - 65px) !important;
   }
}

/* main fly-out menu */
#mask {
   position: fixed;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   min-height: 100%;
   z-index: 4999;
   background: rgba(0,0,0,0.5);
}
#flyout-menu {
   position: fixed;
   visibility: hidden; /* for accessibility */
   z-index: 999999;
   width: 400px;
   max-width: 100%;
   height: 100vh;
   top: 0;
   right: -400px;
   background: var(--hfh-dark-navy);
}
body.fl-builder-edit #flyout-menu {
   display: none !important;
}
#flyout-menu.open {
   visibility: visible;
}
#flyout-menu a.flyout-site-logo {
   display: block;
   position: absolute;
   z-index: 100;
   top: 12px;
   left: 15px;
   width: 80px;
   height: auto;
}
#flyout-menu .inner {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   padding: 70px 0 0 0;
   overflow-y: auto;
   /* Optional but highly reccomended:  enables momentum scrolling on iOS */
   -webkit-overflow-scrolling: touch;
}
#flyout-menu button.close-flyout {
   display: block;
   position: absolute;
   z-index: 100;
   top: 20px;
   right: 20px;
   width: 30px;
   height: 30px;
   border: none;
   background: none;
   margin: 0;
   padding: 0;
}
#flyout-menu button.close-flyout:focus-visible {
   border: 2px solid blue;
}
#flyout-menu button.close-flyout svg {
   width: 100%;
   height: auto;
}
#flyout-menu button.close-flyout svg > path {
   fill: transparent;
   stroke: #fff;
   stroke-width: 2;
   stroke-linejoin: round;
}
/* drop down */
#flyout-menu ul {
   display: block !important;
   margin: 0;
   padding: 0;
   border-top: 1px solid rgba(255,255,255,0.2);
}
#flyout-menu ul li {
   margin: 0;
   padding: 0;
   list-style: none;
   position: relative;
}
#flyout-menu ul li button.drop-button {
   display: none;
}
#flyout-menu ul li.menu-item-has-children button.drop-button {
   display: block;
   width: 50px;
   height: 50px;
   position: absolute;
   top: 0;
   right: 0;
   border-left: 1px solid rgba(255,255,255,0.2);
   cursor: pointer;
}
#flyout-menu ul li.menu-item-has-children button.drop-button::after {
   display:block;
   content:'';
   width:0;
   height:0;
   position:absolute;
   top:20px;
   left:20px;
   border-left:5px solid transparent;
   border-right:5px solid transparent;
   border-top:10px solid #fff;
}
#flyout-menu ul li.menu-item-has-children button.drop-button.open::after {
   border-bottom: 10px solid #fff;
   border-top: none;
}
#flyout-menu ul li.menu-item-has-children button.drop-button:hover {
   background: rgba(255,255,255,0.1);
}
#flyout-menu ul li.menu-item-home {
   display: none;
}
#flyout-menu ul li a {
   display: block;
   height: 50px;
   font-size: 18px;
   line-height: 50px;
   margin: 0;
   padding: 0 50px 0 20px;
   color: #fff;
   border-bottom: 1px solid rgba(255,255,255,0.2);
   text-decoration: none !important;
}
#flyout-menu ul li a:hover {
   text-decoration: underline;
}
#flyout-menu ul li ul {
   display: none;
   border-top: none;
}
#flyout-menu ul li ul li a {
   height: auto;
   line-height: 1.2;
   padding: 12px 10px 12px 40px;
   font-weight: 400;
}
#flyout-menu ul li ul li button.drop-button {
   display: none !important;
}
#flyout-menu ul li ul li ul li a {
   padding-left: 55px;
}
#flyout-menu ul li ul li ul li a::before {
   content: '-';
   display: inline-block;
   padding-right: 4px;
}