bodyfooter{
 font:80%/1.3 Arial,sans-serif;
}
h1footer{
 margin:0;
 padding:1em;
 font-size:1.5em;
 font-weight:bold;
}
h1footer span{
 font-size:.667em;
}
h2footer{
 margin:0;
 padding:1em 1.25em;
 font-size:1.2em;
 font-weight:bold;
}
h3footer{
 margin:0;
 padding:1em 1.5em;
 font-size:1em;
 font-weight:bold;
}
pre{
 margin:.5em 1.5em;
 padding:.3em;
 color:#000;
 background:#fff;
}
pre,pre code,pre var{
 font:1em/1 "courier new",monospace;
}
pre var{
 font-style:oblique;
}
pre code.markup.comment{
 font-style:oblique;
 color:green;
}
pre code.markup.doctype{
 font-style:oblique;
 color:teal;
}
pre code.markup.element-name{
 font-weight: bold;
 color:purple;
}
pre code.markup.attribute-name{
 font-weight: bold;
 color:black;
}
pre code.markup.attribute-value{
 font-weight:normal;
 color:blue;
}
p{
 margin:0;
 padding:.5em 1.5em;
}
div#header{
 background:lime;
 color:black;
}
div#left-sidebar{
 background:yellow;
 color:black;
}
div#right-sidebar{
 background:green;
 color:black;
}
div#mediafooter{
background-image:url(../images/socialmedia-gradient.png) ;
/*background:#333;*/ 
 color:black;
 padding-top:2px;
}

 bodyfooter{
  margin:0;
  padding:0 0 100px 0;
 } 
 div#mediafooter{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:50px;
 }
 @media screen{
  body>div#mediafooter{
   position:fixed;
  }
 }
 * html bodyfooter{
  overflow:hidden;
 } 
 * html div#content{
  height:100%;
  overflow:auto;
 }