@import url("https://fonts.googleapis.com/css?family=Poppins:700");
:root {
--bndarkblue: #002fb1;
--bngrblue: #00a3ffc7;
--bngreen: #3bd100;
--bnlightblue: #00a3ff;
--bnsort: #424242;
--bnwhite: white;
--sfgreen: #557a6e;
--whitesmoke: whitesmoke;
--transparent: transparent;
--grey: grey;
--lightgrey: lightgrey;
--lightgrey1: #efefef;
--lightgrey2: #e6e6e6;
--lightgrey3: #696969;
--lightergrey: #dedede;
--darkgrey: #585858;
--whitesmoke: whitesmoke;
--black: #383838;
--lightergrey: #dedede;
--light-darkgrey: #d8d8d8;
--grey1: #bbbbbb;
--grey-green: #effff1;
--grey2: #ebebeb;
--default-white: white;
--default-darkwhite: #f3f3f3;
--sw-info-color: #3490dc;
--layout-row-shaddow-color-light: rgba(0,0,0,0.1);
--layout-row-shaddow-color-dark: rgba(0,0,0,0.2);
--calendar-selection-background-color: white;
--theme-heading-color: black;
--theme-heading1-color: black;
--theme-heading2-color: black;
--theme-heading3-color: black;
--theme-body-font-color: #424242;
--theme-color-lighten-10: hsl(var(--theme-color),40%);
--theme-color-lighten-20: hsl(var(--theme-color),30%);
--theme-color-darken-10: hsl(var(--theme-color),60%);
--theme-color-darken-20: hsl(var(--theme-color),70%);
--donate-wizard-button-next-color: #585858;
--theme-color: #0b6623;
--theme-font-color: darkwhite;
--theme-color-contrast: whitesmoke;
--default-black: var(--black);
--default-grey: var(--grey);
--navbar-background-color: var(--sfgreen);
--navbar-collapsed-background-color: var(--whitesmoke);
--navbar-font-color: var(--bnwhite);
--navbar-collapsed-font-color: var(--default-black);
--navbar-bars-color: var(--whitesmoke);
--page-title-border-color: var(--theme-color);
--footer-background-color: var(--sfgreen);
--footer-font-color: var(--theme-color-contrast);
--cta-events-date-border-color: var(--theme-color);
}

.datalist-card {
   box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

a.img-rounded::before {
  content: "\01F310";
  display: inline-block;
  margin-right: 4px;
  background: #bbbbbb;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  
}

a.img-thumbnail::before {
  content: "\002709";
  margin-right: 4px;
  font-family: Arial Unicode MS;
  font-size: 1.5em;
  line-height: 1;
  vertical-align: text-top;
  color: #bbbbbb;
}

.navbar__firmname {
    font-size: 1.6rem;
    font-weight: 500;
    letter-spacing: 1px;
    color: whitesmoke;
    display: block;
    /* padding-left: 15px; */
    padding-right: 15px;
    word-break: normal;
}

.navbar__logo {
    width: auto;
    max-height: 40px;
    margin: 5px;
    margin-right: 0px;
}

.navbar__nav--active {
background-color: var(--bnlightblue);
}
  

.cta-events {
   position: relative;
   margin: -30px 0 17px 0;
   box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
   background-color: var(--sfgreen);
}

h1.cta-events__event-description-heading {
   color: whitesmoke !important;
}

.cta-events__location-heading {
   color: whitesmoke;
}


span.cta-events__number {
   color: whitesmoke !important;
}

.cta-events__date {
   border-right: 4px solid var(--bnlightblue) !important;
   color: white;
}


.panel-hero-image__img-button{
   margin-bottom: 20px;
}

.cta-events__location span {
   color: white;
}


.cta-events__event-description {
   color: whitesmoke;
}

.navbar__nav--active {
   background-color: var(--bnlightblue);
}

@media only screen and (max-width: 768px) {
        .navbar {
            background-color: var(--sfgreen) !important;
}
}
@media only screen and (max-width: 1024px){

     .panel-hero-image__img-button {
     margin-bottom: 20px;
       }
}

.org-footer {
   background-color: var(--sfgreen) !important;
}

.org-footer__content-heading{
   color: whitesmoke;
}

.org-footer {
   color: whitesmoke;
}

.footer-site {
   background-color: var(--sfgreen) !important;
}

.footer-site__copyright {
   color: whitesmoke;
}

.blimedlemknapp button {
        position: relative;
        display: inline-block;
        cursor: pointer;
        outline: none;
        border: 0;
        background: transparent;
        width: 25rem;
        height: auto;
        font-family: "Poppins", sans-serif;
    }

.blimedlemknapp button .circle {
        transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
        position: relative;
        display: block;
        margin: 0;
        width: 3rem;
        height: 3rem;
        background: var(--bngreen);
        border-radius: 1.625rem;
    }

.blimedlemknapp button .arrow_icon {
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto;
        background: #fff;
        transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
        left: 0.625rem;
        width: 1.125rem;
        height: 0.125rem;
        background: none;
    }

.blimedlemknapp button .arrow_icon::before {
        position: absolute;
        content: "";
        top: -0.25rem;
        right: 0.0625rem;
        width: 0.625rem;
        height: 0.625rem;
        border-top: 0.125rem solid var(--bndarkblue);
        border-right: 0.125rem solid var(--bndarkblue);
        transform: rotate(45deg);
    }

.blimedlemknapp button .button_text {
        transition: all 0.45s cubic-bezier(0.65, 0, 0.076, 1);
        position: absolute;
        inset: -5px;
        padding: 0.65rem 0;
        margin: 0 0 0 2.9rem;
        color: var(--bndarkblue);
        text-transform: uppercase;
        font-family: 'Poppins';
        font-size: 18px;
        line-height: 1.5;
        letter-spacing: 1px;
    }
    
.blimedlemknapp button:hover .circle {
        width: 100%;
    }

.blimedlemknapp button:hover .arrow_icon {
        background: var(--bndarkblue);
        transform: translate(1rem, 0);
    }

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

    .grid__sm--3 {
        grid-template-columns: 1fr 1fr !important;
        gap: 7px !important;
    }
    .board-member {
        max-width: 170px;
    }
}
.grid__sm--3 {
    grid-template-columns: 2fr 2fr 2fr 2fr 2fr;
}

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

        .navbar {
            background-color: var(--bndarkblue);
        }
}

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

    .grid__sm--3 {
        grid-template-columns: 1fr 1fr !important;
        gap: 7px !important;
    }
    .board-member {
        max-width: 170px;
    }
}
.grid__sm--3 {
    grid-template-columns: 2fr 2fr 2fr 2fr 2fr;
}