API tools faq
paste
Advertisement
paigeh987

Theme 23 - neonbike themes

paigeh987
Feb 8th, 2015
14,167
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.52 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. Theme 23 by Paige @neonbikethemes.tumblr.com
  8. last updated 07.12.16
  9.  
  10. Rules:
  11.  
  12. - Do not steal code or design
  13. - Edit as much as you want but don't remove credit!
  14. - Like/reblog the post
  15.  
  16. Thanks!
  17.  
  18. -->
  19.  
  20. {block:Description}
  21. <meta name="description" content="{MetaDescription}" />
  22. {/block:Description}
  23. <meta charset="utf-8">
  24. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  25. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  28.  
  29. <meta name="image:background" content="">
  30. <meta name="image:sidebar" content="">
  31.  
  32. <meta name="color:Background" content="#ffffff" />
  33. <meta name="color:links" content="#000000" />
  34. <meta name="color:links hover" content="#a0a0a0" />
  35. <meta name="color:text" content="#000000" />
  36. <meta name="color:posts" content="#ffffff" />
  37. <meta name="color:border" content="#f3f3f3" />
  38. <meta name="color:page border" content="#f3f3f3" />
  39. <meta name="color:shadow" content="#f8f8f8" />
  40.  
  41. <meta name="text:Link 1 Title" content="" />
  42. <meta name="text:Link 1 URL" content="/" />
  43. <meta name="text:Link 2 Title" content="" />
  44. <meta name="text:Link 2 URL" content="/" />
  45. <meta name="text:Link 3 Title" content="" />
  46. <meta name="text:Link 3 URL" content="/" />
  47. <meta name="text:Link 4 Title" content="" />
  48. <meta name="text:Link 4 URL" content="/" />
  49.  
  50. <meta name="select:Font" content="Arial" title="Arial">
  51. <meta name="select:Font" content="Courier" title="Courier">
  52. <meta name="select:Font" content="Inconsolata" title="Inconsolata">
  53. <meta name="select:Font" content="Montserrat" title="Montserrat">
  54. <meta name="select:Font" content="Asap" title="Asap">
  55. <meta name="select:Font" content="Fredoka One" title="Fredoka One">
  56. <meta name="select:Font" content="Karla" title="Karla">
  57. <meta name="select:Font" content="Lora" title="Lora">
  58. <meta name="select:Font" content="Open Sans" title="Open Sans">
  59.  
  60. <meta name="select:Permalink Symbol" content="fa-star" title="Star">
  61. <meta name="select:Permalink Symbol" content="fa-moon-o" title="Moon">
  62. <meta name="select:Permalink Symbol" content="fa-power-off" title="Power button">
  63. <meta name="select:Permalink Symbol" content="fa-bolt" title="Lightning Bolt">
  64. <meta name="select:Permalink Symbol" content="fa-times" title="X">
  65. <meta name="select:Permalink Symbol" content="fa-diamond" title="Diamond">
  66. <meta name="select:Permalink Symbol" content="fa-bomb" title="Bomb">
  67. <meta name="select:Permalink Symbol" content="fa-eye" title="Eye">
  68. <meta name="select:Permalink Symbol" content="fa-heart" title="Heart">
  69. <meta name="select:Permalink Symbol" content="fa-umbrella" title="Umbrella">
  70. <meta name="select:Permalink Symbol" content="fa-floppy-o" title="Save">
  71.  
  72. <meta name="select:Link 1 Symbol" content="fa-home" title="Home">
  73. <meta name="select:Link 1 Symbol" content="fa-star" title="Star">
  74. <meta name="select:Link 1 Symbol" content="fa-user" title="Person">
  75. <meta name="select:Link 1 Symbol" content="fa-comment" title="Chat Bubble">
  76. <meta name="select:Link 1 Symbol" content="fa-envelope" title="Mail">
  77. <meta name="select:Link 1 Symbol" content="fa-bolt" title="Lightning Bolt">
  78. <meta name="select:Link 1 Symbol" content="fa-diamond" title="Diamond">
  79. <meta name="select:Link 1 Symbol" content="fa-moon-o" title="Moon">
  80.  
  81. <meta name="select:Link 2 Symbol" content="fa-user" title="Person">
  82. <meta name="select:Link 2 Symbol" content="fa-comment" title="Chat Bubble">
  83. <meta name="select:Link 2 Symbol" content="fa-envelope" title="Mail">
  84. <meta name="select:Link 2 Symbol" content="fa-star" title="Star">
  85. <meta name="select:Link 2 Symbol" content="fa-bolt" title="Lightning Bolt">
  86. <meta name="select:Link 2 Symbol" content="fa-diamond" title="Diamond">
  87. <meta name="select:Link 2 Symbol" content="fa-moon-o" title="Moon">
  88.  
  89. <meta name="select:Link 3 Symbol" content="fa-user" title="Person">
  90. <meta name="select:Link 3 Symbol" content="fa-comment" title="Chat Bubble">
  91. <meta name="select:Link 3 Symbol" content="fa-envelope" title="Mail">
  92. <meta name="select:Link 3 Symbol" content="fa-star" title="Star">
  93. <meta name="select:Link 3 Symbol" content="fa-bolt" title="Lightning Bolt">
  94. <meta name="select:Link 3 Symbol" content="fa-diamond" title="Diamond">
  95. <meta name="select:Link 3 Symbol" content="fa-moon-o" title="Moon">
  96. <meta name="select:Link 3 Symbol" content="fa-umbrella" title="Umbrella">
  97. <meta name="select:Link 3 Symbol" content="fa-floppy-o" title="Save">
  98.  
  99. <meta name="select:Link 4 Symbol" content="fa-folder-open" title="Folder">
  100. <meta name="select:Link 4 Symbol" content="fa-user" title="Person">
  101. <meta name="select:Link 4 Symbol" content="fa-comment" title="Chat Bubble">
  102. <meta name="select:Link 4 Symbol" content="fa-envelope" title="Mail">
  103. <meta name="select:Link 4 Symbol" content="fa-star" title="Star">
  104. <meta name="select:Link 4 Symbol" content="fa-bolt" title="Lightning Bolt">
  105. <meta name="select:Link 4 Symbol" content="fa-diamond" title="Diamond">
  106. <meta name="select:Link 4 Symbol" content="fa-moon-o" title="Moon">
  107. <meta name="select:Link 4 Symbol" content="fa-umbrella" title="Umbrella">
  108. <meta name="select:Link 4 Symbol" content="fa-floppy-o" title="Save">
  109.  
  110. <meta name="if:Show Sidebar Image" content="0"/>
  111. <meta name="if:500px Posts" content="0"/>
  112. <meta name="if:Right Sidebar" content="1"/>
  113. <meta name="if:Page Border" content="1"/>
  114. <meta name="if:Hide Description" content="0"/>
  115. <meta name="if:Hide Captions" content="0"/>
  116. <meta name="if:Show Tags" content="1"/>
  117. <meta name="if:Hide Post Info" content="0"/>
  118. <meta name="if:Post Shadows" content="1"/>
  119. <meta name="if:Infinite Scroll" content="0">
  120. <meta name="if:Grayscale" content="0"/>
  121. <meta name="if:Full size bg" content="0"/>
  122.  
  123.  
  124. <!-- IMPORTED SCRIPTS - DON'T REMOVE -->
  125.  
  126. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  127.  
  128. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  129.  
  130. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  131.  
  132. <!-- TOOLTIP SCRIPT (REMOVE ONYL IF YOU WANT STANDARD BROWSER TOOLTIPS) -->
  133.  
  134. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  135. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  136. <script>
  137. (function($){
  138. $(document).ready(function(){
  139. $("a[title]").style_my_tooltips({
  140. tip_follows_cursor:true,
  141. tip_delay_time:90,
  142. tip_fade_speed:600,
  143. attribute:"title"
  144. });
  145. });
  146. })(jQuery);
  147. </script>
  148.  
  149. <!-- FONT SCRIPTS -->
  150.  
  151. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  152.  
  153. <link href='http://fonts.googleapis.com/css?family=Fredoka+One|Asap:400,700,400italic,700italic|Inconsolata:400,700|Montserrat:400,700' rel='stylesheet' type='text/css'>
  154. <link href="https://fonts.googleapis.com/css?family=Karla:400,700|Lora:400,700|Open+Sans:400,700" rel="stylesheet">
  155.  
  156. <!-- INFINITE SCROLL -->
  157.  
  158. {block:IfInfiniteScroll}
  159. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  160. {/block:IfInfiniteScroll}
  161.  
  162. <style type="text/css">
  163.  
  164. /* ---------------------------- GENERAL ----------------------------- */
  165.  
  166. /* -------- SELECTION TOOL ------- */
  167.  
  168. ::-moz-selection {
  169. background: {color:text};
  170. color: {color:background};
  171. }
  172.  
  173. ::selection {
  174. background: {color:text};
  175. color: {color:background};
  176. }
  177.  
  178. /* -------- SCROLLBAR ------- */
  179.  
  180. ::-webkit-scrollbar {
  181. width: 15px;
  182. height: 0px;
  183. right:5px;
  184. top:20px;
  185. }
  186.  
  187. /* Track */
  188. ::-webkit-scrollbar-track {
  189. {block:Ifnotpageborder}
  190. border-left:5px solid {color:posts};
  191. border-right:5px solid {color:posts};
  192. {/block:Ifnotpageborder}
  193. {block:Ifpageborder}
  194. border-left:5px solid {color:page border};
  195. border-right:5px solid {color:page border};
  196. {/block:Ifpageborder}
  197. background:{color:border};
  198. }
  199.  
  200. /* Handle */
  201. ::-webkit-scrollbar-thumb {
  202. background:{color:background};
  203. border:5px solid {color:border};
  204. }
  205.  
  206. ::-webkit-scrollbar-thumb:window-inactive {
  207. background:{color:background};
  208. height:10px;
  209. }
  210.  
  211. /* ------- TOOLTIPS ------ */
  212.  
  213. #s-m-t-tooltip {
  214. max-width:300px;
  215. margin:10px 0px 0px 10px;
  216. background-color:{color:posts};
  217. font-family: {select:font}, courier, helvetica;
  218. padding:6px;
  219. padding-left:10px;
  220. padding-right:10px;
  221. border:5px solid {color:border};
  222. font-size:12px;
  223. color:{color:text};
  224. z-index:999999999999999999999999999999999999;
  225. }
  226.  
  227. /* -------- FONTS -------- */
  228.  
  229. @import url(http://fonts.googleapis.com/css?family=Fredoka+One|Asap:400,700,400italic,700italic|Inconsolata:400,700|Montserrat:400,700);
  230.  
  231. /* -------- BASICS ------- */
  232.  
  233. body {
  234. background:{color:Background} url('{image:background}');
  235. {block:Iffullsizebg}
  236. background-size:100% 100%;
  237. background-repeat:no-repeat;
  238. {/block:Iffullsizebg}
  239. background-attachment:fixed;
  240. color: {color:text};
  241. font-family: {select:Font}, courier, helvetica;
  242. font-size: 11px;
  243. margin: 0;
  244. padding: 0;
  245. word-wrap: break-word;
  246. line-height:150%;
  247. }
  248.  
  249. a {
  250. color: {color:links};
  251. text-decoration: none;
  252. -webkit-transition: all .3s;
  253. -moz-transition: all .3s;
  254. -o-transition: all .3s;
  255. -ms-transition: all .3s;
  256. transition: all .3s;
  257. }
  258.  
  259. a:hover{
  260. color:{color:links hover};
  261. -webkit-transition: all .3s;
  262. -moz-transition: all .3s;
  263. -o-transition: all .3s;
  264. -ms-transition: all .3s;
  265. transition: all .3s;
  266. }
  267.  
  268. blockquote {
  269. border-left: 1px solid {color:border};
  270. margin: 5px;
  271. padding-left:20px;
  272. padding-top:1px;
  273. padding-bottom:1px;
  274. }
  275.  
  276. iframe, img, embed, object, video {
  277. max-width: 100%;
  278. }
  279.  
  280. p{
  281. margin-bottom:10px;
  282. }
  283.  
  284. img {
  285. height: auto;
  286. width:auto;
  287. max-width:100%;
  288. }
  289.  
  290. h1{
  291. text-transform:uppercase;
  292. font-size:13px;
  293. }
  294.  
  295. ul{
  296. list-style-type:square;
  297. }
  298.  
  299. ol{
  300. list-style-type:;
  301. }
  302.  
  303. #bigcon{
  304. {block:Ifnot500pxposts}
  305. width: 420px;
  306. {/block:Ifnot500pxposts}
  307. {block:If500pxposts}
  308. width:540px;
  309. {/block:If500pxposts}
  310.  
  311. {block:Ifnotrightsidebar}
  312. left:50%;
  313. margin-left:-200px;
  314. {/block:Ifnotrightsidebar}
  315. {block:Ifrightsidebar}
  316. left:50%;
  317. margin-left:-400px;
  318. {/block:Ifrightsidebar}
  319. margin-top:90px;
  320. z-index:9;
  321. position:relative;
  322. }
  323.  
  324. .tmblr-iframe, #tumblr_controls, tmblr-iframe tmblr-iframe--desktop-logged-in-controls, .iframe-controls--desktop{
  325. top:2px;
  326. right:3px;
  327. position:fixed !important;
  328. margin-top:0px !important;
  329. margin-right:0px !important;
  330. opacity:0.9 !important;
  331. z-index:999999 !important;
  332. filter: invert(1);
  333. -webkit-filter: invert(1);
  334. -moz-filter: invert(1);
  335. -o-filter: invert(1);
  336. -ms-filter: invert(1);
  337. }
  338.  
  339. /* ---------------------------- TOPBAR/BORDER ------------------------ */
  340.  
  341. .topbar{
  342. position:fixed;
  343. top:0px;
  344. width:100%;
  345. height:30px;
  346. background:{color:page border};
  347. z-index:999;
  348. }
  349.  
  350. .bottombar{
  351. position:fixed;
  352. bottom:0px;
  353. width:100%;
  354. height:30px;
  355. background:{color:page border};
  356. z-index:999;
  357. }
  358.  
  359. .rightbar{
  360. position:fixed;
  361. right:0px;
  362. top:0px;
  363. height:100%;
  364. width:30px;
  365. background:{color:page border};
  366. z-index:999;
  367. }
  368.  
  369. .leftbar{
  370. position:fixed;
  371. top:0px;
  372. height:100%;
  373. width:30px;
  374. background:{color:page border};
  375. z-index:999;
  376. }
  377.  
  378.  
  379. /* ----------------------------- HEADER STUFF ---------------------------*/
  380.  
  381. #sidebar{
  382. position:fixed;
  383. margin-top:0px;
  384. {block:Ifrightsidebar}
  385. {block:Ifnot500pxposts}
  386. margin-left:510px;
  387. {/block:Ifnot500pxposts}
  388. {block:If500pxposts}
  389. margin-left:610px;
  390. {/block:If500pxposts}
  391. {/block:Ifrightsidebar}
  392. {block:Ifnotrightsidebar}
  393. {block:Ifnot500pxposts}
  394. margin-left:-310px;
  395. {/block:Ifnot500pxposts}
  396. {block:If500pxposts}
  397. margin-left:-310px;
  398. {/block:If500pxposts}
  399. {/block:Ifnotrightsidebar}
  400. margin-bottom:50px;
  401. text-align:left;
  402. width:230px;
  403. z-index:999999;
  404. }
  405.  
  406. .blogtitle{
  407. text-transform:uppercase;
  408. font-size:18px;
  409. letter-spacing:1px;
  410. font-weight:300;
  411. font-style:italic;
  412. text-align:center;
  413. border:5px solid {color:border};
  414. {block:Ifpostshadows}
  415. box-shadow:10px 10px 0px {color:shadow};
  416. {/block:Ifpostshadows}
  417. background:{color:border};
  418. color:{color:links hover};
  419. padding:15px;
  420. line-height:100%;
  421. -webkit-transition: all .3s;
  422. -moz-transition: all .3s;
  423. -o-transition: all .3s;
  424. -ms-transition: all .3s;
  425. transition: all .3s;
  426. }
  427.  
  428. .blogtitle:hover{
  429. background:{color:posts};
  430. color:{color:text};
  431. -webkit-transition: all .3s;
  432. -moz-transition: all .3s;
  433. -o-transition: all .3s;
  434. -ms-transition: all .3s;
  435. transition: all .3s;
  436. }
  437.  
  438. .desc{
  439. margin-top:-5px;
  440. padding:15px;
  441. border:5px solid {color:border};
  442. {block:Ifpostshadows}
  443. box-shadow:10px 10px 0px {color:shadow};
  444. {/block:Ifpostshadows}
  445. color:{color:text};
  446. background:{color:posts};
  447. }
  448.  
  449. #navbar{
  450. text-align:left;
  451. margin-top:20px;
  452. }
  453.  
  454. .navlink {
  455. padding:6px;
  456. padding-left:10px;
  457. padding-right:10px;
  458. display:inline-block;
  459. width:153px;
  460. text-transform:uppercase;
  461. letter-spacing:1px;
  462. border:5px solid {color:border};
  463. {block:Ifpostshadows}
  464. box-shadow:10px 10px 0px {color:shadow};
  465. {/block:Ifpostshadows}
  466. color:{color:text};
  467. background:{color:posts};
  468. margin-bottom:5px;
  469. margin-right:-8px;
  470. -webkit-transition: all .3s;
  471. -moz-transition: all .3s;
  472. -o-transition: all .3s;
  473. -ms-transition: all .3s;
  474. transition: all .3s;
  475. }
  476.  
  477. .navlink:hover{
  478. color:{color:links hover};
  479. background:{color:border};
  480. -webkit-transition: all .3s;
  481. -moz-transition: all .3s;
  482. -o-transition: all .3s;
  483. -ms-transition: all .3s;
  484. transition: all .3s;
  485. }
  486.  
  487. .navlinky{
  488. padding:6px;
  489. width:10px;
  490. text-align:center;
  491. padding-left:10px;
  492. padding-right:10px;
  493. display:inline-block;
  494. text-transform:uppercase;
  495. letter-spacing:1px;
  496. color:{color:links hover};
  497. background:{color:border};
  498. border:5px solid {color:border};
  499. {block:Ifpostshadows}
  500. box-shadow:10px 10px 0px {color:shadow};
  501. {/block:Ifpostshadows}
  502. margin-bottom:8px;
  503. margin-right:3px;
  504. }
  505.  
  506. .sbimg{
  507. border:5px solid {color:border};
  508. margin-bottom:15px;
  509. {block:Ifpostshadows}
  510. box-shadow:10px 10px 0px {color:shadow};
  511. {/block:Ifpostshadows}
  512. }
  513.  
  514. .sbimg img{
  515. width:100%;
  516. margin-bottom:-4px;
  517. }
  518.  
  519. /* --------------------------- POSTS (articles) --------------------- */
  520.  
  521. article {
  522. float:left;
  523. background:{color:posts};
  524. border:5px solid {color:border};
  525. {block:Ifpostshadows}
  526. box-shadow:10px 10px 0px {color:shadow};
  527. {/block:Ifpostshadows}
  528. {block:Ifnot500pxposts}
  529. width: 400px;
  530. margin-bottom:120px;
  531. {/block:Ifnot500pxposts}
  532. {block:If500pxposts}
  533. margin-right:40px;
  534. margin-bottom:120px;
  535. width:500px;
  536. {/block:If500pxposts}
  537. }
  538.  
  539. article img{
  540. margin-bottom:-5px;
  541. max-width:100%;
  542. {block:Ifgrayscale}
  543. filter: gray;
  544. -webkit-filter: grayscale(100%);
  545. {/block:Ifgrayscale}
  546. }
  547.  
  548. /* ---------------------------- POST INFO -----------------------------*/
  549.  
  550. .tags {
  551. font-weight:normal;
  552. text-transform:lowercase;
  553. }
  554.  
  555. .tags a{
  556. margin-right:5px;
  557. }
  558.  
  559. .permpostinfo{
  560. border-top:5px solid {color:border};
  561. border-bottom:5px solid {color:border};
  562. padding:20px;
  563. text-align:left;
  564. }
  565.  
  566. .indexpostinfo{
  567. {block:Ifhidepostinfo}
  568. opacity:0;
  569. {/block:Ifhidepostinfo}
  570. {block:Ifnothidepostinfo}
  571. opacity:1;
  572. {/block:Ifnothidepostinfo}
  573. position:absolute;
  574. float:left;
  575. text-align:text-top;
  576. margin-top:10px;
  577. margin-left:-5px;
  578. -webkit-transition: all .3s;
  579. -moz-transition: all .3s;
  580. -o-transition: all .3s;
  581. -ms-transition: all .3s;
  582. transition: all .3s;
  583. }
  584.  
  585. article:hover .indexpostinfo{
  586. opacity:1;
  587. -webkit-transition: all .3s;
  588. -moz-transition: all .3s;
  589. -o-transition: all .3s;
  590. -ms-transition: all .3s;
  591. transition: all .3s;
  592. }
  593.  
  594. .time{
  595. position:relative;
  596. display:inline-block;
  597. border:5px solid {color:border};
  598. background:{color:border};
  599. color:{color:links hover};
  600. {block:Ifpostshadows}
  601. box-shadow:10px 10px 0px {color:shadow};
  602. {/block:Ifpostshadows}
  603. padding:10px;
  604. height:16px;
  605. text-transform:uppercase;
  606. font-size:12px;
  607. letter-spacing:1px;
  608. padding-top:6px;
  609. padding-bottom:6px;
  610. -webkit-transition: all .3s;
  611. -moz-transition: all .3s;
  612. -o-transition: all .3s;
  613. -ms-transition: all .3s;
  614. transition: all .3s;
  615. }
  616.  
  617. .time a{
  618. color:{color:links hover};
  619. }
  620.  
  621. .time:hover{
  622. color:{color:text};
  623. background:{color:posts};
  624. -webkit-transition: all .3s;
  625. -moz-transition: all .3s;
  626. -o-transition: all .3s;
  627. -ms-transition: all .3s;
  628. transition: all .3s;
  629. }
  630.  
  631. .permabutton{
  632. position:relative;
  633. display:inline-block;
  634. color:{color:links hover};
  635. background:{color:border};
  636. width:15px;
  637. text-align:center;
  638. border:5px solid {color:border};
  639. padding:6px;
  640. font-size:13px;
  641. height:16px;
  642. margin-right:2px;
  643. {block:Ifpostshadows}
  644. box-shadow:10px 10px 0px {color:shadow};
  645. {/block:Ifpostshadows}
  646. -webkit-transition: all .3s;
  647. -moz-transition: all .3s;
  648. -o-transition: all .3s;
  649. -ms-transition: all .3s;
  650. transition: all .3s;
  651. }
  652.  
  653. .permabutton a{
  654. color:{color:links hover};
  655. }
  656.  
  657. .permabutton:hover{
  658. color:{color:text};
  659. background:{color:posts};
  660. -webkit-transition: all .3s;
  661. -moz-transition: all .3s;
  662. -o-transition: all .3s;
  663. -ms-transition: all .3s;
  664. transition: all .3s;
  665. }
  666.  
  667. .permabutton:hover a{
  668. color:{color:text};
  669. }
  670.  
  671. .indextags{
  672. padding:10px;
  673. border-top:5px solid {color:border};
  674. background:{color:posts};
  675. text-align:center;
  676. }
  677.  
  678. /* ----------------------------- CAPTIONS -------------------------- */
  679.  
  680. .caption{
  681. background:{color:captions};
  682. border-top:5px solid {color:border};
  683. padding:20px;
  684. }
  685.  
  686. /* ---------------------------- POST NOTES ------------------------- */
  687.  
  688. ol.notes {
  689. display:block;
  690. text-align:left;
  691. list-style-type:none;
  692. padding:10px;
  693. padding-left:20px;
  694. max-height:200px;
  695. overflow:scroll;
  696. }
  697.  
  698. ol.notes li.note{
  699. margin-left:10px;
  700. }
  701.  
  702. .pagenotes {
  703. text-align:left;
  704. margin-right:10px;
  705. margin-top:10px;
  706. margin-bottom:10px;
  707. }
  708.  
  709. .pagenotes img{
  710. display:none!important;
  711. }
  712.  
  713. /* -------- SCROLLBAR ------- */
  714.  
  715. div.pagenotes ::-webkit-scrollbar {
  716. width: 15px;
  717. height: 0px;
  718. }
  719.  
  720. /* Track */
  721. div.pagenotes ::-webkit-scrollbar-track {
  722. border-left:5px solid {color:posts};
  723. border-right:5px solid {color:posts};
  724. background:{color:border};
  725. }
  726.  
  727. /* Handle */
  728. div.pagenotes ::-webkit-scrollbar-thumb {
  729. background:{color:background};
  730. border:5px solid {color:border};
  731. }
  732.  
  733. div.pagenotes ::-webkit-scrollbar-thumb:window-inactive {
  734. background:{color:background};
  735. height:0px;
  736. }
  737.  
  738.  
  739. /* -------------------------- POST TYPES -------------------------- */
  740.  
  741. /* TEXT */
  742.  
  743. .textpost{
  744. padding:40px;
  745. text-align:left;
  746. }
  747.  
  748. .title{
  749. padding:25px;
  750. text-align:center;
  751. text-transform:uppercase;
  752. margin-left:-40px;
  753. margin-right:-40px;
  754. margin-top:-40px;
  755. margin-bottom:40px;
  756. border-bottom:5px solid {color:border};
  757. background:{color:border};
  758. color:{color:links hover};
  759. font-size:18px;
  760. letter-spacing:1px;
  761. -webkit-transition: all .3s;
  762. -moz-transition: all .3s;
  763. -o-transition: all .3s;
  764. -ms-transition: all .3s;
  765. transition: all .3s;
  766. }
  767.  
  768. .title:hover{
  769. background:{color:posts};
  770. color:{color:text};
  771. -webkit-transition: all .3s;
  772. -moz-transition: all .3s;
  773. -o-transition: all .3s;
  774. -ms-transition: all .3s;
  775. transition: all .3s;
  776. }
  777.  
  778. /* CHAT */
  779.  
  780. ul.chat{
  781. list-style:none;
  782. padding:0px;
  783. margin-top:0px;
  784. margin-bottom:0px;
  785. }
  786.  
  787. li.chat{
  788. padding:15px;
  789. }
  790.  
  791. li.chat:nth-child(odd) {
  792. background: {color:posts};
  793. color:{color:text};
  794. }
  795.  
  796. li.chat:nth-child(even) {
  797. background: {color:border};
  798. color:{color:links hover};
  799. }
  800.  
  801. /* QUOTES */
  802.  
  803. .quote{
  804. font-size:16px;
  805. font-weight:300;
  806. line-height:150%;
  807. padding:25px;
  808. background:{color:border};
  809. color:{color:links hover};
  810. }
  811.  
  812. .quotesource{
  813. text-align:center;
  814. padding:25px;
  815. border-top:5px solid {color:border};
  816. }
  817.  
  818.  
  819. /* QUESTIONS */
  820.  
  821. .question{
  822. padding:25px;
  823. z-index:9;
  824. text-align:center;
  825. color:{color:links hover};
  826. background:{color:border};
  827. }
  828.  
  829. .question a{
  830. color:{color:links hover};
  831. }
  832.  
  833. .answer {
  834. padding:20px;
  835. border-top:5px solid {color:border};
  836. }
  837.  
  838.  
  839. /* AUDIO */
  840.  
  841. .songart{
  842. float:left;
  843. margin-right:20px;
  844. }
  845.  
  846. .songart img{
  847. {block:Ifnot500pxposts}
  848. width:140px;
  849. height:140px;
  850. {/block:Ifnot500pxposts}
  851. {block:If500pxposts}
  852. width:200px;
  853. height:200px;
  854. {/block:If500pxposts}
  855. }
  856.  
  857. .songtitle{
  858. {block:Ifnot500pxposts}
  859. margin-left:140px;
  860. height:60px;
  861. padding-top:80px;
  862. {/block:Ifnot500pxposts}
  863. {block:If500pxposts}
  864. margin-left:90px;
  865. height:60px;
  866. padding-top:140px;
  867. {/block:If500pxposts}
  868. font-size:18px;
  869. font-weight:300;
  870. text-align:left;
  871. padding-left:50px;
  872. text-transform:uppercase;
  873. vertical-align:bottom;
  874. color:{color:links hover};
  875. background:{color:border};
  876. }
  877.  
  878. .songauthor{
  879. margin-top:10px;
  880. font-size:10px;
  881. font-weight:400;
  882. line-height:0px;
  883. margin-bottom:10px;
  884. }
  885.  
  886. .audiobutton{
  887. position:absolute;
  888. {block:Ifnot500pxposts}
  889. margin-top:30px;
  890. margin-left:30px;
  891. {/block:Ifnot500pxposts}
  892. {block:If500pxposts}
  893. margin-top:60px;
  894. margin-left:60px;
  895. {/block:If500pxposts}
  896. height:35px;
  897. width:35px;
  898. border:20px solid rgba(255,255,255,0.30);
  899. {block:IndexPage}
  900. opacity:0;
  901. {/block:IndexPage}
  902. -webkit-transition: all .3s;
  903. -moz-transition: all .3s;
  904. -o-transition: all .3s;
  905. -ms-transition: all .3s;
  906. transition: all .3s;
  907. }
  908.  
  909. article:hover .audiobutton{
  910. opacity:1;
  911. -webkit-transition: all .3s;
  912. -moz-transition: all .3s;
  913. -o-transition: all .3s;
  914. -ms-transition: all .3s;
  915. transition: all .3s;
  916. }
  917.  
  918. .tumblr_audio_player {
  919. height:35px;
  920. }
  921.  
  922. .linktitle{
  923. padding:25px;
  924. text-transform:uppercase;
  925. background:{color:border};
  926. color:{color:links hover};
  927. text-align:center;
  928. font-size:18px;
  929. letter-spacing:1px;
  930. -webkit-transition: all .3s;
  931. -moz-transition: all .3s;
  932. -o-transition: all .3s;
  933. -ms-transition: all .3s;
  934. transition: all .3s;
  935. }
  936.  
  937. .linktitle:hover{
  938. color:{color:text};
  939. background:{color:posts};
  940. -webkit-transition: all .3s;
  941. -moz-transition: all .3s;
  942. -o-transition: all .3s;
  943. -ms-transition: all .3s;
  944. transition: all .3s;
  945. }
  946.  
  947. .linkdesc{
  948. padding:20px;
  949. border-top:5px solid {color:border};
  950. }
  951.  
  952. /* PHOTOSET */
  953.  
  954. .photoset{
  955. margin-bottom:-2px;
  956. background:{color:border};
  957. overflow:hidden;
  958. {block:Ifgrayscale}
  959. filter: gray;
  960. -webkit-filter: grayscale(100%);
  961. {/block:Ifgrayscale}
  962. }
  963.  
  964. /* ------------------------- PAGINATION ------------------------- */
  965.  
  966. .pagi{
  967. position:static;
  968. margin-top:30px;
  969. margin-bottom:150px;
  970. width:400px;
  971. text-align:left;
  972. text-transform:uppercase;
  973. letter-spacing:1px;
  974. }
  975.  
  976. .pagibutton{
  977. position:relative;
  978. display:inline-block;
  979. background:{color:posts};
  980. padding:15px;
  981. border:5px solid {color:border};
  982. {block:Ifpostshadows}
  983. box-shadow:10px 10px 0px {color:shadow};
  984. {/block:Ifpostshadows}
  985. }
  986.  
  987. .pagibutton:hover{
  988. background:{color:border};
  989. color:{color:links hover};
  990. -webkit-transition: all .3s;
  991. -moz-transition: all .3s;
  992. -o-transition: all .3s;
  993. -ms-transition: all .3s;
  994. transition: all .3s;
  995. }
  996.  
  997. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
  998. #infscr-loading {display:none;}
  999. .navigation {display:none!important;}
  1000.  
  1001. /* ---------------------------- CREDIT ------------------------- */
  1002.  
  1003. .credit{
  1004. position:fixed;
  1005. {block:Ifpageborder}
  1006. right:40px;
  1007. bottom:40px;
  1008. {/block:Ifpageborder}
  1009. {block:Ifnotpageborder}
  1010. box-shadow:8px 8px 0px {color:shadow};
  1011. right:20px;
  1012. bottom:20px;
  1013. {/block:Ifnotpageborder}
  1014. color:{color:text};
  1015. padding:3px;
  1016. padding-left:6px;
  1017. padding-right:6px;
  1018. background:{color:posts};
  1019. border:5px solid {color:border};
  1020. -webkit-transition: all .3s;
  1021. -moz-transition: all .3s;
  1022. -o-transition: all .3s;
  1023. -ms-transition: all .3s;
  1024. transition: all .3s;
  1025. }
  1026.  
  1027. .credit:hover{
  1028. background:{color:border};
  1029. color:{color:links hover};
  1030. -webkit-transition: all .3s;
  1031. -moz-transition: all .3s;
  1032. -o-transition: all .3s;
  1033. -ms-transition: all .3s;
  1034. transition: all .3s;
  1035. }
  1036.  
  1037.  
  1038.  
  1039. /* --------------------------- Custom CSS -------------------------- */
  1040.  
  1041. {CustomCSS}
  1042.  
  1043.  
  1044. </style>
  1045. </head>
  1046. <body>
  1047.  
  1048. {block:Ifpageborder}
  1049. <div class="topbar"></div>
  1050. <div class="bottombar"></div>
  1051. <div class="leftbar"></div>
  1052. <div class="rightbar"></div>
  1053. {/block:Ifpageborder}
  1054.  
  1055.  
  1056.  
  1057. <div id="bigcon">
  1058.  
  1059.  
  1060. <!--SIDEBAR -->
  1061.  
  1062. <div id="sidebar">
  1063.  
  1064. {block:Ifshowsidebarimage}
  1065. <div class="sbimg"><img src="{image:sidebar}"></div>
  1066. {/block:Ifshowsidebarimage}
  1067.  
  1068. <a href="/"><div class="blogtitle">{Title}</div></a>
  1069.  
  1070. {block:Ifnothidedescription}
  1071. <div class="desc">{Description}</div>
  1072. {/block:Ifnothidedescription}
  1073. {block:Ifhidedescription}
  1074. {/block:Ifhidedescription}
  1075.  
  1076. <div id="navbar">
  1077. {block:IfLink1title}
  1078. <a href="{text:link 1 url}">
  1079. <div class="navlinky"><i class="fa {select:link 1 symbol}"></i></div>
  1080. <div class="navlink">{text:Link 1 Title}</div></a>
  1081. {/block:IfLink1title}
  1082. {block:IfLink2title}<br>
  1083. <a href="{text:link 2 url}">
  1084. <div class="navlinky"><i class="fa {select:link 2 symbol}"></i></div>
  1085. <div class="navlink">{text:Link 2 Title}</div></a>
  1086. {/block:Iflink2title}
  1087. {block:IfLink3title}<br>
  1088. <a href="{text:link 3 url}">
  1089. <div class="navlinky"><i class="fa {select:link 3 symbol}"></i></div>
  1090. <div class="navlink">{text:Link 3 Title}</div></a>
  1091. {/block:Iflink3title}
  1092. {block:IfLink4title}<br>
  1093. <a href="{text:link 4 url}">
  1094. <div class="navlinky"><i class="fa {select:link 4 symbol}"></i></div>
  1095. <div class="navlink">{text:Link 4 Title}</div></a>
  1096. {/block:Iflink4title}
  1097. </div>
  1098. </div>
  1099.  
  1100.  
  1101. <div id="postcontainer">
  1102.  
  1103. <div class="autopagerize_page_element">
  1104. {block:Posts}
  1105. <article>
  1106.  
  1107. <!--TEXT POST-->
  1108. {block:Text}
  1109. <div class="textpost">
  1110. {block:Title}
  1111. <a href="{Permalink}"><div class="title">{Title}</div></a>
  1112. {/block:Title}
  1113. {Body}
  1114. </div>
  1115. {/block:Text}
  1116.  
  1117.  
  1118. <!--PHOTO POST-->
  1119. {block:Photo}
  1120. {block:Ifnot500pxposts}
  1121. {LinkOpenTag}
  1122. <img src="{PhotoURL-400}" alt="{PhotoAlt}" />
  1123. {LinkCloseTag}
  1124. {/block:Ifnot500pxposts}
  1125. {block:If500pxposts}
  1126. {LinkOpenTag}
  1127. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1128. {LinkCloseTag}
  1129. {/block:If500pxposts}
  1130. {/block:Photo}
  1131.  
  1132.  
  1133. <!--PHOTOSET POST-->
  1134. {block:Photoset}
  1135. {block:Ifnot500pxposts}
  1136. <div class="photoset">{Photoset-400}</div>
  1137. {/block:Ifnot500pxposts}
  1138. {block:If500pxposts}
  1139. <div class="photoset">{Photoset-500}</div>
  1140. {/block:If500pxposts}
  1141. {/block:Photoset}
  1142.  
  1143.  
  1144. <!--QUOTE POST-->
  1145. {block:Quote}
  1146. <div class="quote"><i class="fa fa-quote-left"></i> {Quote} <i class="fa fa-quote-right"></i></div>
  1147. {block:Source}
  1148. <div class="quotesource">{Source}</div>
  1149. {/block:Source}
  1150. {/block:Quote}
  1151.  
  1152.  
  1153. <!--LINK POST-->
  1154. {block:Link}
  1155. <a href="{URL}"><div class="linktitle">{Name} <i class="fa fa-long-arrow-right"></i></div></a>
  1156. {block:Description}
  1157. <div class="linkdesc">{Description}</div>
  1158. {/block:Description}
  1159. {/block:Link}
  1160.  
  1161.  
  1162. <!--CHAT POST-->
  1163. {block:Chat}
  1164. {block:Title}
  1165. <a href="{Permalink}"><div class="linktitle">{Title}</div></a>
  1166. {/block:Title}
  1167. <ul class="chat">
  1168. {block:Lines}
  1169. <li class="chat">{block:Label}<b>{Label}</b>{/block:Label} {Line}</li>
  1170. {/block:Lines}
  1171. </ul>
  1172. {/block:Chat}
  1173.  
  1174.  
  1175. <!--AUDIO POST-->
  1176. {block:Audio}
  1177. {block:AlbumArt}
  1178. <div class="songart">
  1179. <img src="{AlbumArtURL}">
  1180. </div>
  1181. <div class="audiobutton">
  1182. {AudioPlayerWhite}
  1183. </div>
  1184. {/block:AlbumArt}
  1185. <div class="songtitle">
  1186. {block:Artist}
  1187. <div class="songauthor">{Artist}</div>
  1188. {/block:Artist}
  1189. {block:TrackName}{TrackName}{/block:TrackName}
  1190. </div>
  1191. {/block:Audio}
  1192.  
  1193.  
  1194. <!--VIDEO POST-->
  1195. {block:Video}
  1196. <div class="video">
  1197. {block:Ifnot500pxposts}
  1198. <div class="video-player">{Video-400}</div>
  1199. {/block:Ifnot500pxposts}
  1200. {block:If500pxposts}
  1201. <div class="video-player">{Video-500}</div>
  1202. {/block:If500pxposts}
  1203. </div>
  1204. {/block:Video}
  1205.  
  1206.  
  1207. <!--ANSWER POST-->
  1208. {block:Answer}
  1209. <div class="question">
  1210. <span style="font-size:13px; text-transform:uppercase; letter-spacing:1px; font-weight:bold;">{Asker}</span>
  1211. <br>{Question}
  1212. </div>
  1213. <div class="answer">{Answer}</div>
  1214. {/block:Answer}
  1215.  
  1216. <!--CAPTIONS-->
  1217. {block:Ifhidecaptions}
  1218. {block:permalink}
  1219. {block:Caption}
  1220. <div class="caption">{caption}</div>
  1221. {/block:Caption}
  1222. {/block:permalink}
  1223. {/block:Ifhidecaptions}
  1224. {block:Ifnothidecaptions}
  1225. {block:Caption}
  1226. <div class="caption">{caption}</div>
  1227. {/block:Caption}
  1228. {/block:Ifnothidecaptions}
  1229.  
  1230. {block:IndexPage}
  1231. {block:Ifshowtags}
  1232. {block:HasTags}
  1233. <div class="indextags">
  1234. {block:Tags}
  1235. <a href="{TagURL}">#{Tag}, </a>
  1236. {/block:Tags}
  1237. </div>
  1238. {/block:HasTags}
  1239. {/block:Ifshowtags}
  1240. <div class="indexpostinfo">
  1241. <a href="{Permalink}"><div class="permabutton">
  1242. <i class="fa {select:permalink symbol}"></i></div></a>
  1243. <a href="{Permalink}"><div class="time">{TimeAgo}</div></a>
  1244. <a href="{Permalink}"><div class="time">{NoteCountWithLabel}</div></a>
  1245. </div>
  1246. {/block:IndexPage}
  1247.  
  1248. {block:PermalinkPage}
  1249. <div class="permpostinfo">
  1250.  
  1251. {TimeAgo}
  1252.  
  1253. <!--VIA AND SOURCE-->
  1254. {block:RebloggedFrom}
  1255. ( <a href="{ReblogParentURL}">Via</a>
  1256. {/block:RebloggedFrom}
  1257. {block:ContentSource}
  1258. & <a href="{SourceURL}">Source</a>
  1259. {/block:ContentSource}
  1260. {block:RebloggedFrom} ){/block:RebloggedFrom}
  1261.  
  1262. <!--TAGS-->
  1263. {block:HasTags}
  1264. <div class="tags">
  1265. {block:Tags}
  1266. <a href="{TagURL}">#{Tag}, </a>
  1267. {/block:Tags}
  1268. </div>
  1269. {/block:HasTags}
  1270.  
  1271. </div>
  1272. {/block:PermalinkPage}
  1273.  
  1274.  
  1275.  
  1276.  
  1277. <!--POST NOTES-->
  1278. {block:PostNotes}
  1279. <div class="pagenotes">{PostNotes-16}</div>
  1280. {/block:PostNotes}
  1281.  
  1282.  
  1283.  
  1284.  
  1285. </article>
  1286. {/block:Posts}
  1287. </div>
  1288. <!--Close of article-->
  1289.  
  1290.  
  1291. <!--PAGINATION-->
  1292. {block:IfNotInfiniteScroll}
  1293. {block:Pagination}
  1294. <div class="pagi">
  1295. {block:PreviousPage}
  1296. <a href="{PreviousPage}">
  1297. <div class="pagibutton">Previous</div></a>
  1298. {/block:PreviousPage}
  1299. {block:NextPage}
  1300. <a href="{NextPage}">
  1301. <div class="pagibutton">Next</div></a>
  1302. {/block:NextPage}
  1303. </div>
  1304. {/block:Pagination}
  1305. {/block:IfNotInfiniteScroll}
  1306.  
  1307.  
  1308. </div>
  1309. </div>
  1310. </div>
  1311. </div>
  1312.  
  1313. <a href="http://neonbikethemes.tumblr.com" title="Neonbike Themes">
  1314. <div class="credit">N</div>
  1315. </a>
  1316.  
  1317.  
  1318. </body>
  1319. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!