/**
 * Footer Styling
 */

 /* Wrapper */
#prefooter,
#footer {
  background: #0067b2;
  clear: both;
  font-family: "MADE Tommy Soft", sans-serif;
  letter-spacing: .06rem;
  padding: 2rem;
  position: relative; /* < Important for the z-index to work */
  z-index: 300;
}
/* Links */
#footer a {
  color: #fff !important;
}

/* This removes the "Other" title, used for social media icons */
#footer .other.other span {
  display: none;
}
/* This adjusts the space left by removing the "Other" title */
.other.other .menu {
  margin-top: -1rem;
}

/* This removes the carrot from the collapsed */
.menu-item--collapsed::marker,
.menu-item--expanded::marker {
  content: "";
}

/* Top Row menu */
#footer .menu-item .menu-item,
#footer .free-newsletter,
#footer .donate,
#footer .social-media {
  margin-top: .5rem;
  line-height: 100%;
}

.menu-item .other.social-media {
  margin-left: -1.5rem;
}

#footer ul li a,
#footer .free-newsletter a,
#footer .donate a,
#footer .social-media a {
  color: #fec63e !important; /* <--- This is the top-level menu color */
  font-size: 1rem;
  text-transform: uppercase;
}
#footer .free-newsletter a,
#footer .donate a,
#footer .social-media a {
  margin-left: -1.5rem;
}
#footer .menu-item {
  margin-top: 1.5rem;
}
#footer ul li ul li a {
  color: #fff !important;
  font-size: 1rem;
}

#footer .site-logo img {
  width: 100%;
  max-width: 300px;
  margin-bottom: 0rem;
}
#footer .donate,
#footer .free-newsletter {
  margin-top: 2rem !important;
  margin-left: -1rem;
  margin-bottom: 2rem !important;
}
#footer .donate {
  margin-bottom: 3rem !important;
}

#footer .social-media .twitter,
#footer .social-media .instagram,
#footer .social-media .youtube,
#footer .social-media .linkedin{
  padding: 1rem 0 0rem;
  display: inline;
}
#footer .social-media .twitter a {
  background: url(/sites/default/files/2023-06/twitter.png) 0 0 no-repeat;
  padding: 1rem;
  background-size: 2rem !important;
  font-size: 0;
}
#footer .social-media .instagram a {
  background: url(/sites/default/files/2023-06/instagram_0.png) 0 0 no-repeat;
  padding: 1rem;
  background-size: 2rem !important;
  font-size: 0;
}
#footer .social-media .youtube a {
  background: url(/sites/default/files/2023-06/youtube_0.png) 0 0 no-repeat;
  padding: 1rem;
  background-size: 2rem !important;
  font-size: 0;
}
#footer .social-media .linkedin a {
  background: url(/sites/default/files/2023-06/linkedin_0.png) 0 0 no-repeat;
  padding: 1rem;
  font-size: 0;
  background-size: 2rem !important;
}
#footer .free-newsletter a,
#footer .donate a,
#footer .social-media a {
margin-left: 0rem;
}

@media all and (min-width: 480px) {

}

@media all and (min-width: 800px) {

  #footer .navigation {
              margin-left: 2rem;
            }
            #footer .navigation .menu {
              display: grid;
              grid-template-columns: 90% 90% 90%;
            }
            #footer ul.menu {
              margin-bottom: 2rem;
            }
            #footer .social-media {
              margin-top: .5rem !important;
            }
            #footer .donate,
            #footer .free-newsletter {
              margin-top: 1rem !important;
              margin-left: 0rem;
              margin-bottom: 0 !important;
              }
            #footer .donate {
              margin-bottom: 1rem !important;
              }
            .menu-item .other.social-media {
              margin-left: 0rem;
            }
            #footer li.menu-item ul {
              display: flex;
              flex-wrap: no-wrap;
              }
            #footer .site-logo img {
              margin-left:.7rem;
            }
            #footer .menu-item {
              margin-top: 0;
              list-style: none;
            }
            #footer .navigation .menu .menu {
              display: flex;
              flex-flow: column;
              margin-left: 0rem;
              width: 14rem;
            }
            /* This makes the social media icons horizontal */
            .menu-item.menu-item--expanded.footer.other.social-media ul.menu {
              display: flex;
              flex-flow: row !important;
              }
}


@media all and (min-width: 1000px) {

}

@media all and (min-width: 1250px) {
              #footer .navigation .menu {
                display: inline-flex;
              }

}