API tools faq
paste
dansmilth

Gallery Theme 02 (Part 1)

dansmilth
Jul 19th, 2015
1,417
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.49 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3.  
  4. <!-----------
  5.  
  6. GALLERY THEME 02 by clumhood
  7.  
  8. :> ------------>
  9.  
  10. <title>Home - HQ Gallery</title>
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  14.  
  15. <link href='http://fonts.googleapis.com/css?family=Roboto:700,400' rel='stylesheet' type='text/css'>
  16.  
  17. <script type="text/javascript">
  18. WebFontConfig = {
  19. google: { families: [ 'Roboto:700,400:latin' ] }
  20. };
  21. (function() {
  22. var wf = document.createElement('script');
  23. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  24. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  25. wf.type = 'text/javascript';
  26. wf.async = 'true';
  27. var s = document.getElementsByTagName('script')[0];
  28. s.parentNode.insertBefore(wf, s);
  29. })(); </script>
  30.  
  31. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  32.  
  33. <style type="text/css">
  34.  
  35. body {
  36. font-family:arial;
  37. font-size:12px;
  38. background:#f8f8f8; /**this is the color of the bg.*/
  39. margin:0px;
  40.  
  41. }
  42.  
  43. a {
  44. color:#676767; /**this is the color of the links.*/
  45. text-decoration:none;
  46. }
  47.  
  48. h1 {
  49. font-family:'roboto', sans-serif;
  50. font-size:13px;
  51. text-transform:uppercase;
  52. }
  53.  
  54. ::-webkit-scrollbar {
  55. background-color: white;
  56. height:8px;
  57. width:5px
  58. }
  59.  
  60. ::-webkit-scrollbar-thumb:vertical {
  61. background-color:black;
  62. height:50px
  63. }
  64.  
  65. ::-webkit-scrollbar-thumb:horizontal {
  66. background-color:black;
  67. height:8px!important
  68. }
  69.  
  70.  
  71. .header {
  72. margin-left:calc(50% - 550px);
  73. width:1100px;
  74.  
  75. }
  76.  
  77. .navi {
  78. width:1040px;
  79. margin-left:calc(50% - 550px);
  80. padding:30px;
  81. background:white;
  82. }
  83.  
  84. .navi a {
  85. font-family:'roboto', sans-serif;
  86. font-size:12px;
  87. text-transform:uppercase;
  88. font-weight:bold;
  89. padding:30px;
  90. border-right:1px solid #eee;
  91.  
  92. }
  93.  
  94. .navi a:hover {
  95. -webkit-transition: all 0.5s ease-in;
  96. -moz-transition: all 0.5s ease-in;
  97. -o-transition: all 0.5s ease-in;
  98. background:#d0465d; /*this is the color of the background of the topbar links when you hover over them.*/
  99. color:white; /**this is the color of the topbar links when you hover over them.*/
  100. }
  101.  
  102.  
  103. .navi a:first-child {
  104. margin-left:-30px;
  105. }
  106.  
  107. .navi a:last-child {
  108. margin-right:-30px;
  109. border:none;
  110. }
  111.  
  112.  
  113. .container {
  114. width:1040px;
  115. margin-top:10px;
  116. background:white; /**this is the color of the container's background.*/
  117. padding:30px;
  118. margin-left:calc(50% - 550px);
  119. margin-bottom:10px;
  120.  
  121. }
  122.  
  123. .cat {
  124. font-family:'roboto', sans-serif;
  125. text-transform:uppercase;
  126. font-size:15px;
  127. font-weight:bold;
  128. }
  129.  
  130. .cat a {
  131. display:block;
  132. padding:20px;
  133. border-bottom:1px solid #eee;
  134. }
  135.  
  136. .cat a:hover {
  137. color:#d0465d; /**this is the color of the category links hover.*/
  138. -webkit-transition: all 0.5s ease-in;
  139. -moz-transition: all 0.5s ease-in;
  140. -o-transition: all 0.5s ease-in;
  141. }
  142.  
  143. #footer {
  144. margin-top: 20px;
  145. background:black; /**this is the color of the background of the disclaimer.*/
  146. float: left;
  147. width: 1100px;
  148. height: auto;
  149. padding-top: 50px;
  150. padding-bottom: 30px;
  151. margin-left:calc(50% - 550px);
  152. }
  153.  
  154. #footer-align {
  155. vertical-align: middle;
  156. display: table-cell;
  157. width: 100%;
  158. height: auto;
  159. }
  160.  
  161. #footer-content {
  162. width: 1000px;
  163. margin: 0 auto;
  164.  
  165. }
  166.  
  167. #footer-title {
  168. font-weight: bold;
  169. font-size: 12px;
  170. text-transform: uppercase;
  171. color: #5d5d5d;/*this is the color of the words 'LUKEHEMMOSOURCE' of the disclaimer.*/
  172. text-decoration: none;
  173. letter-spacing:1px;
  174. float: center;
  175. margin-right: -5px;
  176. margin-bottom: 10px;
  177. font-family:'roboto', sans-serif;
  178.  
  179. }
  180.  
  181. #footer-content {
  182. margin-top: -5px;
  183. font-size: 8pt;
  184. line-height: 12pt;
  185. color: #5d5d5d; /*this is the color of the words of the disclaimer.*/
  186. float:center;
  187. text-align: justify;
  188. font-family:'roboto', sans-serif;
  189. letter-spacing:1px;
  190. }
  191.  
  192. #footer-site {
  193. font-weight: bold;
  194. text-transform: uppercase;
  195. }
  196.  
  197. #footer a {
  198. color: #d0465d; /*this is the color of the links of the disclaimer.*/
  199. font-weight: bold;
  200. }
  201.  
  202. #footer a:hover{
  203. color: #ffffff; /**this is the color of the disclaimer links hover.*/
  204. text-decoration: none;
  205. font-weight: bold;
  206. }
  207.  
  208. </style>
  209. </head>
  210.  
  211. <body>
  212.  
  213. <!-- TOPBAR LINKS -->
  214.  
  215. <div class="navi">
  216. <a href="/gallery">refresh</a>
  217. <a href="/ask">contact</a>
  218. <a href="/">back to lhs</a>
  219.  
  220. <!-- SOCIAL MEDIA LINKS -->
  221.  
  222. <font style="float:right;"><a href="http://twitter.com/luke5sos"><i class="fa fa-twitter"></i></a>
  223. <a href="http://instagram.com/luke_is_a_penquin"><i class="fa fa-instagram"></i></a>
  224. <a href="https://www.youtube.com/channel/UC-vKwDHcbPLtjml81ohGRng"><i class="fa fa-youtube-play"></i></a>
  225. <a href="http://5sos.com/"><i class="fa fa-globe"></i></a></font>
  226. </div>
  227.  
  228. <!-- HEADER IMAGE 1100X500px -->
  229.  
  230. <div class="header"><img src="http://static.tumblr.com/zy3qjic/NAnnrc7k4/h1.png"></div>
  231.  
  232. <!-- CATEGORY LINKS -->
  233.  
  234. <div class="container">
  235.  
  236. <h1>Categories</h1> <br><br>
  237.  
  238. <div class="cat">
  239. <a href="/tagged/hq">All HQS</a>
  240. <a href="/candids">Candids</a>
  241. <a href="/appearances">Appearances</a>
  242. <a href="/photoshoots">Photoshoots</a>
  243. <a href="/performances">Performances</a>
  244. <a href="/tours">Tours</a>
  245. <a href="/bts">Behind the scenes</a>
  246. <a href="/tagged/fan pic">Fan pictures</a>
  247. </div>
  248.  
  249. </div>
  250.  
  251. <!-- DISCLAIMER -->
  252.  
  253. <div id="footer"> <div id="footer-content"> <div id="footer-align"> <div id="footer-title">© lukehemmosource <font style="float:right;">© Designed by <a href="http://clumhood.tumblr.com/">CLUMHOOD</a></font> </div> <div class="footer-content"><b>Disclaimer:</b> We do not claim any ownership for any type of multimedia content posted unless stated otherwise. The information on this blog is copyright to its respectful owners. If there's any content posted that belongs to you and you do not wish for it to appear on this site, please message us with the link of the post you'd like to be removed. We're in no way affiliated with Luke, the rest of the 5SOS boys, friends, family or management. </div> </div> </div> </div></div>
  254.  
  255. </body>
  256. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!