www.mikescher.com/www/data/css/styles_footer.scss

@import 'styles_config';

html, body {
  margin:0;
  padding:0;
  height:100%;
}

// https://stackoverflow.com/a/19723677/1761622

#mastercontainer {
  display:flex;
  flex-direction: column;
  min-height:100%;
  position:relative;
}
#headerdiv {
  //...
}
#content {
  padding-bottom:60px;   /* Height of the footer */
}

#footerdiv {
  position:absolute;
  bottom:0;
  width:100%;
  height:60px;   /* Height of the footer */
  text-align: center;

  color: $COL_FOOTER_FG;

  left: 0;
  right: 0;
  margin: 0 auto;
}

//----------------------------------------------

@include rdmedia(0) { #footerdiv { width: auto;   } }
@include rdmedia(1) { #footerdiv { width: auto;   } }
@include rdmedia(2) { #footerdiv { width: auto;   } }
@include rdmedia(3) { #footerdiv { width: 724px;  } }
@include rdmedia(4) { #footerdiv { width: 1170px; } }

#footerdiv hr {
  margin-bottom: 5px;
  display:block;
  border:none;
  color:white;
  height:1px;
  background: $COL_FOOTER_FG;
  background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from($COL_RADIAL_UNDERLINE_START), to($COL_RADIAL_UNDERLINE_END));
}

@include rdmedia_range(0,1) {
  #footerdiv .footerspan2 {display: none;  visibility: collapse;}
}