/* Footer. */

#footer { font-family: 'Source Sans'; font-weight: 300; font-size: 110%;
          color: #b2b2b2; background-color: #3c3c3c; margin-top: 1em;
          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; }


/* 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 img
   { height: auto; vertical-align: middle; width: 30px; padding-right: 6px;
     opacity: 0.40; filter: alpha(opacity=40); }
#footer #social img:hover
   { opacity: 1.0; filter: alpha(opacity=100); }


/* 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 { font-size: 1.4vw; padding: 0.25em 0 1.5em 0; }
     #footer-cells { display: flex; flex-direction: row; }
     #footer-cells #contact { flex-basis: 30%; padding-left: 2em; }
     #footer-cells #information { flex-basis: 24%; }
     #footer-cells #feeds { flex-basis: 21%; }
     #footer-cells #social { flex-basis: 25%; }
     #footer #social img { width: 2.5vw; }
     #footer #footer-sig, #footer #legal-stuff { padding-left: 2em; }
     
     #footer .personicon { padding-left: 2vw; background-size: 1.6vw 1.6vw; }
     #footer .mapicon { padding-left: 2vw; background-size: 1.6vw 1.6vw; } 
     #footer .phoneicon { padding-left: 2vw; background-size: 1.6vw 1.6vw; }
     #footer .informationicon { padding-left: 2vw; background-size: 1.6vw 1.6vw; }
     #footer .rssicon { padding-left: 2vw; background-size: 1.3vw 1.3vw; } }