/* Screen-reader-only labels (e.g. social icon links). */

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Article / news share row (Font Awesome; #social-media in content). */
#content #social-media a.article-share-link
   { display: inline-block; vertical-align: middle; margin-right: 6px;
     color: #303030; font-size: 30px; line-height: 1; text-decoration: none;
     opacity: 0.25; filter: alpha(opacity=25); }
#content #social-media a.article-share-link:hover
   { opacity: 1.0; filter: alpha(opacity=100); }
#content #social-media a.article-share-link > i
   { vertical-align: -0.125em; width: 1.1em; }

/* Footer. */

#footer-container { width: 100%; background-color: #3c3c3c; }

#footer { font-family: 'National 2', 'Source Sans'; font-weight: 400; font-size: 110%;
          color: #b2b2b2; padding: 0.25em 1em 1.5em 1em; line-height: 160%; }


/* General styles. */

#footer p { margin: 0; }
#footer .footertitle { font-size: 120%; color: #f0f0f0; margin: 1em 0 0.25em 0; }
#footer a { color: #b2b2b2; }
#footer a:hover { color: white; }
/* #footer #legal-stuff a { color: #e0e0e0; } */
#footer #legal-stuff .fineprint a { text-decoration: underline; }


/* Minor positioning tweaks. */

#footer #footer-sig, #footer #legal-stuff { margin: 1em 0; }
#footer #footer-sig .footertitle { margin-bottom: 0.1em; }


/* Inline social media icons. */

#footer #social a
   { display: inline-block; vertical-align: middle; margin-right: 4px;
     color: #b2b2b2; opacity: 0.40; filter: alpha(opacity=40);
     font-size: 30px; line-height: 1; text-decoration: none; }
#footer #social a:hover
   { color: white; opacity: 1.0; filter: alpha(opacity=100); }
#footer #social .fa-brands { vertical-align: -0.125em; width: 1.1em; }


/* Background image icons. */

#footer .personicon
{ padding-left: 24px; background-position: center left; background-repeat: no-repeat;
  background-image: url(/assets/chan/icons/person-white40.png); background-size: 20px 20px; }

#footer .mapicon
{ padding-left: 24px; background-position: center left; background-repeat: no-repeat;
  background-image: url(/assets/chan/icons/map-pin-white40.png); background-size: 20px 20px; }

#footer .phoneicon
{ padding-left: 24px; background-position: 0% 7%; background-repeat: no-repeat;
  background-image: url(/assets/chan/icons/phone-white40.png); background-size: 20px 20px; }

#footer .informationicon
{ padding-left: 24px; background-position: center left; background-repeat: no-repeat;
  background-image: url(/assets/chan/icons/information-white40.png); background-size: 20px 20px; }

#footer .rssicon
{ padding-left: 24px; background-position: center left; background-repeat: no-repeat;
  background-image: url(/assets/chan/icons/rss-white40.png); background-size: 18px 18px; }


/* Reformatting as flex-box for larger screens. */

@media (min-width: 768px) {
   #footer { margin: 0 50px; max-width: var(--Desktop-Container-Width);
             font-size: min(1.4vw, 18.9px); padding: 0.25em 0 1.5em 0; }
   #footer-cells { display: flex; flex-direction: row; }
   #footer-cells #contact { flex-basis: 31%; }
   #footer-cells #information { flex-basis: 25%; }
   #footer-cells #feeds { flex-basis: 21%; }
   #footer-cells #social { flex-basis: 23%; }
   #footer #social a { font-size: min(2.5vw, 33.7px); margin-right: 0.25vw * 0.75; }

   #footer .personicon, #footer .mapicon, #footer .phoneicon, #footer .informationicon
      { padding-left: 2vw; background-size: min(1.6vw, 21.5px) min(1.6vw, 21.5px); }
   #footer .rssicon
      { padding-left: 2vw; background-size: min(1.3vw, 17.5px) min(1.3vw, 17.5px); }
}

@media (min-width: 1348px) {
   #footer { margin: 0 auto; }
}
