footer { display:block; } html { min-height:100%; width:100%; position:relative; } .body { margin-bottom:2em; } .navbar { top:0; left:0; display:block; border-bottom: 1px solid #eee; margin-bottom:10px; height:2em; width:100%; } .navbar ul { list-style-type:none; display: block; margin:0; padding:0; overflow:hidden; height:100%; } .navbar li { display: inline-block; position: relative; margin-right:10px; margin-bottom: 0; top:50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .navbar a { color:#333; text-transform:uppercase; text-decoration:none; font-size:bold; } .brand { font-weight:bold; font-size:normal !important; } .cate { font-weight:bold; font-size:small; } .posts { font-family: verdana,arial,helvetica,sans-serif; list-style-type:none; } .posts li a { color:#369; text-decoration:none; } .footnote { font-family: verdana,arial,helvetica,sans-serif; color:#888; font-size:x-small; margin-bottom:0; } .footnote a { color: #888 !important } .footer { position:absolute; z-index:2; border-top: 1px solid #eee; height:1.5em; width:100%; bottom:0; padding-top:0.1em; } .post { z-index:9; display:block; font-family: proxima-nova,"Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; color:#484848; overflow:auto; padding:0; padding-bottom:1em; padding-top:1em; font-size:16px; line-height:25px; } .post h1 { font-size:23px; letter-spacing:normal; } .post h2 { font-size:22px; letter-spacing:normal; } .post h3 { font-size:21px; letter-spacing:normal; } .post h4 { font-size:20px; letter-spacing:normal; } .post h5 { font-size:19px; letter-spacing:normal; } .post h6 { font-size:18px; letter-spacing:normal; } .away { margin-top:2em; } .post-wrapper { margin-top:2em; } #post-title h5 { font-weight:bold; font-family: 'Open Sans', 'Clear Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; color:#2d2d2d; letter-spacing:normal; } @media screen and (max-width:768px){ .navbar { display:none; overflow:visible; height:auto; } .navbar li { width:100%; clear:both; margin-bottom:5px; margin-right:0; transform: translateY(0); } .navbar ul { height:auto; overflow:auto; } .navbar .brand { font-weight:normal !important; } #menu { text-align:center; display:block; padding:0; margin-bottom:10px; height:1.5em; padding-bottom:4px; border-bottom: 1px solid #eee; } #menu a { float:right; cursor:pointer; font-size:large; } #menu span { float:left; text-transform:uppercase; font-weight:bold; } } @media screen and (min-width:768px){ #menu { display:none; } }