body {
}


footer {
  text-align: center;
  height: 200px; /* change this to other values to and see */
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
}
 
footer:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 100%;
  min-height: inherit;
  max-height: inherit;
}
.centered { /* the element to center */
  display: inline-block;
  vertical-align: middle;
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
}