<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="author" content="<% author %>" /> <meta name="generator" content="MinigalNano <% version %>" /> <title><% title %></title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="alternate" type="application/rss+xml" title="<% title %>" href="rss.php" /> <link rel="stylesheet" href="<% gallery_root %>css/mediaboxWhite.css" type="text/css" media="screen" /> <style type="text/css"> html{ font-size: 62.5%; } body { margin: 0; padding: 0; width: 100%; font-size: 1.5rem; font-family:Helvetica, Arial, sans-serif; background: #222; color: #F1F1F1; } a { color: #F1F1F1; font-weight: bold; text-decoration: none; } h1 { margin: 20px 0 0 0; font-family: Georgia, Lucida, serif; font-style: italic; } h1 a{ color: #CC2027; } body > header{ background-color:#111; padding: 1px 0 0 0; margin-bottom: 1rem; } #container, #innerheader{ max-width: <% gallery_width %>; margin: 0px auto; } header aside{ padding: 2rem 0; } img { border: none; } nav { font-size: 1.3em; padding-top: 2rem; } body > nav { text-align: center; } #folder_comment { margin-bottom:10px; } #folder_comment a { color: #FFCC11; text-decoration: none; } #backtop, #backtop:hover, #backtop:active, .b-lazy { -webkit-transition:all .2s ease-in; -o-transition:all .2s ease-in; transition:all .2s ease-in; } #gallery { list-style: none; margin: 0; padding: 0; } #gallery li, #gallery li img { border-radius: 4px; } #gallery li { float: left; position: relative; overflow:hidden; margin: .5%; } #gallery li img{ width: 100%; } #gallery a { color: #222; } #gallery em { background: #FFF; text-align: center; font-style: normal; padding: 8px 0px; display: block; position: absolute; bottom:0px; width: 100%; } .clear { clear:both; } footer { padding-top: 2rem; margin: 25px 0px; text-align: center; } footer a { text-decoration: none; color: #AAA; } /*----Back to top button---*/ #backtop { display: block; position: fixed; bottom: 0; right: 0; padding: 1rem 4rem; background-color: #CC2027; color: #FFF; margin: .5%; border-radius: 4px; -webkit-box-shadow: 0px 0px 2px -1px #000; box-shadow: 0px 0px 2px -1px #000; } /*----lazyloading---*/ .loader{ background: url('images/loader.gif') center center no-repeat; } .b-lazy { opacity: 0; } .b-lazy.b-loaded { opacity: 1; } /*----responsive----*/ #gallery li { width: 24%; height: 0; padding-bottom: 24%; } @media (max-width: 1000px) { #gallery li { width: 32%; padding-bottom: 32%; } } @media (max-width: 800px) { #gallery li { width: 48%; padding-bottom: 48%; } } @media (max-width: 450px) { #gallery li { width: 100%; padding-bottom: 100%; } } </style> <script src="<% gallery_root %>js/lazy.js"></script> <script src="<% gallery_root %>js/script.js"></script> <script src="<% gallery_root %>js/mootools1.5.0.js"></script> <script src="<% gallery_root %>js/mediabox1.5.4.js"></script> </head> <body> <header id="top" role="banner"> <div id="innerheader"> <h1><a href="<% gallery_root %>"><% title %></a></h1> <% messages %> <nav role="navigation"><% breadcrumb_navigation %></nav> <aside><% folder_comment %></aside> </div> </header> <main id="container"> <ul id="gallery"> <% thumbnails %> </ul> </main> <nav class="clear" role="navigation"><% page_navigation %></nav> <a href="#top" id="backtop">top</a> <footer role="contentinfo"> Gallery by <% author %> / <a href="https://github.com/sebsauvage/MinigalNano" title="Powered by MiniGal Nano" target="_blank"> Powered by MiniGal Nano <% version %> </a> / <a href="http://tomcanac.com/minigal/" title="Tom Canac" target="_blank"> Board theme by Tom Canac </a> / <a title="<% title %> RSS" href="rss.php"> RSS </a> </footer> </body> </html>