/* =Infinity Styles -------------------------------------------------------------- */ .infinite-wrap { } .infinite-loader { color: #000; display: block; height: 28px; text-indent: -9999px; } #infinite-handle span { background: #333; border-radius: 1px; color: #eee; cursor: pointer; font-size: 13px; padding: 6px 16px; } /** * Using a highly-specific rule to make sure that all button styles * will be reset */ #infinite-handle span button, #infinite-handle span button:hover, #infinite-handle span button:focus { display: inline; position: static; padding: 0; margin: 0; border: none; line-height: inherit; background: transparent; color: inherit; cursor: inherit; font-size: inherit; font-weight: inherit; font-family: inherit; } /** * This is used to avoid unnecessary inner button spacing in Firefox */ #infinite-handle span button::-moz-focus-inner { margin: 0; padding: 0; border: none; } /** * For smaller viewports, remove the down-arrow icon and turn * the button into a block element, spanning the content's full width. */ @media (max-width: 800px) { #infinite-handle span:before { display: none; } #infinite-handle span { display: block; } } /** * Footer */ #infinite-footer { position: fixed; bottom: -50px; left: 0; width: 100%; } #infinite-footer a { text-decoration: none; } #infinite-footer .blog-info a:hover, #infinite-footer .blog-credits a:hover { color: #444; text-decoration: underline; } #infinite-footer .container { background: rgba( 255, 255, 255, 0.8 ); border-color: #ccc; border-color: rgba( 0, 0, 0, 0.1 ); border-style: solid; border-width: 1px 0 0; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0 auto; overflow: hidden; padding: 1px 20px; width: 780px; } #infinite-footer .blog-info, #infinite-footer .blog-credits { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; line-height: 25px; } #infinite-footer .blog-info { float: left; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; width: 40%; } #infinite-footer .blog-credits { font-weight: normal; float: right; width: 60%; } #infinite-footer .blog-info a { color: #111; font-size: 14px; font-weight: bold; } #infinite-footer .blog-credits { color: #888; font-size: 12px; text-align: right; } #infinite-footer .blog-credits a { color: #666; } /** * Hooks to infinity-end body class to restore footer */ .infinity-end.neverending #infinite-footer { display: none; } /** * Responsive structure for the footer */ @media (max-width: 640px) { #infinite-footer .container { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; } #infinite-footer .blog-info { width: 30%; } #infinite-footer .blog-credits { width: 70%; } #infinite-footer .blog-info a, #infinite-footer .blog-credits { font-size: 10px; } } /** * No fixed footer on small viewports */ @media ( max-width: 640px ) { #infinite-footer { position: static; } }