API tools faq
paste
Advertisement
b0rn-to-be-wild

Theme: KAWAII DREAMS (vol.3)

b0rn-to-be-wild
Jul 25th, 2014
5,074
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 47.41 KB | None | 0 0
raw download clone embed print report
  1. <!----
  2.  
  3. ©borntobewildcodes.tumblr.com | KAWAII DREAMS (vol.3)
  4.  
  5. + Do not redistribute this theme or remove the credits.
  6. + Edit as long as you keep the credits intact
  7. + Contact me if you have any questions or concerns.
  8. + If you want a custom theme you can commission me.
  9. + Thanks for using my theme, I hope that you enjoy it.
  10.  
  11. Other credits:
  12.  
  13. - Jquery
  14. - Disqus
  15. - Google fonts
  16. - Font Awesome icons
  17. - Masonry by David Desandro
  18. - Infinite scroll by Paul Irish
  19. - PXU Photosets
  20. - Masonry with Infinite Scroll and PXU Photosets tutorial by @shythemes
  21. - Load more buttons tutorial by @shythemes
  22. - Hide stuff tutorial by @lmthemes
  23.  
  24. ---->
  25.  
  26. <!DOCTYPE html>
  27. <head>
  28.  
  29. <title>{block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  30.  
  31. <link rel="shortcut icon" href="{favicon}">
  32.  
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  35.  
  36. <meta name="image:Background" content="1"/>
  37. <meta name="image:Avatar" content="1"/>
  38.  
  39. <meta name="color:Background" content="#fff"/>
  40. <meta name="color:Container background" content="#fff"/>
  41. <meta name="color:Container border" content="#FFCBCC"/>
  42. <meta name="color:Main icon" content="#333333"/>
  43. <meta name="color:Blog Title" content="#222222"/>
  44. <meta name="color:Menu link" content="#333333"/>
  45. <meta name="color:Sidebar background" content="#FFFFFF"/>
  46. <meta name="color:Sidebar border" content="#FFCBCC"/>
  47. <meta name="color:Sidebar title" content="#444444"/>
  48. <meta name="color:Sidebar text" content="#444444"/>
  49. <meta name="color:Sidebar link" content="#A1C5E8"/>
  50. <meta name="color:Post background" content="#FFFFFF"/>
  51. <meta name="color:Post info background" content="#FFFFFF"/>
  52. <meta name="color:Link post background" content="#eeeeee"/>
  53. <meta name="color:Post border" content="#FFCBCC"/>
  54. <meta name="color:Ask bubble" content="#eee"/>
  55. <meta name="color:Title" content="#3583B1"/>
  56. <meta name="color:Text" content="#222222"/>
  57. <meta name="color:Link" content="#cab1da"/>
  58. <meta name="color:Hover" content="#75a1e2"/>
  59. <meta name="color:Bold" content="#000"/>
  60. <meta name="color:Italic" content="#75a1e2"/>
  61. <meta name="color:Buttons" content="#75a1e2"/>
  62. <meta name="color:Borders" content="#ddd"/>
  63. <meta name="color:Pagination" content="#315f7a"/>
  64. <meta name="color:Scrollbar" content="#ddd"/>
  65. <meta name="color:Scrollbar background" content="#fff"/>
  66.  
  67. <meta name="font:Body font" content="Helvetica"/>
  68. <meta name="select:Body font size" content="12px" title="12px">
  69. <meta name="select:Body font size" content="13px" title="13px">
  70. <meta name="select:Body font size" content="14px" title="14px">
  71. <meta name="select:Body font size" content="15px" title="15px">
  72. <meta name="select:Body font size" content="16px" title="16px">
  73.  
  74. <meta name="select:Title Font" content="Great Vibes" title="Great Vibes">
  75. <meta name="select:Title Font" content="Clicker Script" title="Clicker Script">
  76. <meta name="select:Title Font" content="Alex Brush" title="Alex Brush">
  77. <meta name="select:Title Font" content="Rouge Script" title="Rouge Script">
  78. <meta name="select:Title Font" content="The Girl Next Door" title="The Girl Next Door">
  79.  
  80. <meta name="select:Title font size" content="22px" title="22px">
  81. <meta name="select:Title font size" content="25px" title="25px">
  82. <meta name="select:Title font size" content="27px" title="27px">
  83. <meta name="select:Title font size" content="30px" title="30px">
  84. <meta name="select:Title font size" content="32px" title="32px">
  85.  
  86. <meta name="select:Blog title font size" content="20px" title="20px">
  87. <meta name="select:Blog title font size" content="22px" title="22px">
  88. <meta name="select:Blog title font size" content="25px" title="25px">
  89. <meta name="select:Blog title font size" content="27px" title="27px">
  90. <meta name="select:Blog title font size" content="30px" title="30px">
  91. <meta name="select:Blog title font size" content="32px" title="32px">
  92.  
  93. <meta name="select:Sidebar title font size" content="20px" title="20px">
  94. <meta name="select:Sidebar title font size" content="22px" title="22px">
  95. <meta name="select:Sidebar title font size" content="25px" title="25px">
  96. <meta name="select:Sidebar title font size" content="27px" title="27px">
  97. <meta name="select:Sidebar title font size" content="30px" title="30px">
  98. <meta name="select:Sidebar title font size" content="32px" title="32px">
  99.  
  100. <meta name="select:Post width" content="400" title="400px">
  101. <meta name="select:Post width" content="500" title="500px">
  102. <meta name="select:Post width" content="540" title="540px">
  103.  
  104. <meta name="if:Inverted Controls" content="0"/>
  105. <meta name="if:Infinite Scroll" content="0"/>
  106. <meta name="if:Load More" content="0"/>
  107. <meta name="if:Sidebar Right" content="0" />
  108. <meta name="if:Blog title background blue" content="0" />
  109. <meta name="if:Header background blue" content="0" />
  110. <meta name="if:Menu background blue" content="0" />
  111. <meta name="if:Avatar border blue" content="0" />
  112. <meta name="if:Sidebar title background blue" content="0" />
  113. <meta name="if:Show Main Icons" content="1" />
  114. <meta name="if:Show Search Box" content="1" />
  115. <meta name="if:Show Social Icons" content="1" />
  116. <meta name="if:Show Avatar" content="1" />
  117. <meta name="if:Show Description" content="1" />
  118. <meta name="if:Show Navigation" content="1" />
  119. <meta name="if:Show Stats" content="1" />
  120. <meta name="if:Show Updates" content="1" />
  121. <meta name="if:Show Blogroll" content="1" />
  122. <meta name="if:Show Info On Hover" content="0" />
  123. <meta name="if:Faded Images" content="0" />
  124. <meta name="if:Monochrome Images" content="0" />
  125. <meta name="if:Show Captions" content="1" />
  126. <meta name="if:Show Tags" content="1" />
  127. <meta name="if:Ask Enabled" content="1" />
  128. <meta name="if:Submissions Enabled" content="1" />
  129. <meta name="if:Show Archive Link" content="1" />
  130. <meta name="if:Disqus Shortname" content="0"/>
  131.  
  132. <meta name="if:Show Menu Link One" content="1" />
  133. <meta name="if:Show Menu Link Two" content="1" />
  134. <meta name="if:Show Menu Link Three" content="1" />
  135. <meta name="if:Show Menu Link Four" content="1" />
  136. <meta name="if:Show Menu Link Five" content="1" />
  137. <meta name="if:Show Menu Link Six" content="1" />
  138.  
  139. <meta name="if:Show Navi Link One" content="1" />
  140. <meta name="if:Show Navi Link Two" content="1" />
  141. <meta name="if:Show Navi Link Three" content="1" />
  142. <meta name="if:Show Navi Link Four" content="1" />
  143. <meta name="if:Show Navi Link Five" content="1" />
  144.  
  145. <meta name="text:Menu Link One" content="link 1"/>
  146. <meta name="text:Menu Link One url" content="http://"/>
  147. <meta name="text:Menu Link Two" content="link 2"/>
  148. <meta name="text:Menu Link Two url" content="http://"/>
  149. <meta name="text:Menu Link Three" content="link 3"/>
  150. <meta name="text:Menu Link Three url" content="http://"/>
  151. <meta name="text:Menu Link Four" content="link 4"/>
  152. <meta name="text:Menu Link Four url" content="http://"/>
  153. <meta name="text:Menu Link Five" content="link 5"/>
  154. <meta name="text:Menu Link Five url" content="http://"/>
  155. <meta name="text:Menu Link Six" content="link 6"/>
  156. <meta name="text:Menu Link Six url" content="http://"/>
  157.  
  158. <meta name="text:Navi link one" content="link one"/>
  159. <meta name="text:Navi link one url" content="http://"/>
  160. <meta name="text:Navi link two" content="link two"/>
  161. <meta name="text:Navi link two url" content="http://"/>
  162. <meta name="text:Navi link three" content="link three"/>
  163. <meta name="text:Navi link three url" content="http://"/>
  164. <meta name="text:Navi link four" content="link four"/>
  165. <meta name="text:Navi link four url" content="http://"/>
  166. <meta name="text:Navi link five" content="link five"/>
  167. <meta name="text:Navi link five url" content="http://"/>
  168.  
  169. <meta name="text:Title One" content="About">
  170. <meta name="text:Title Two" content="Navigation">
  171. <meta name="text:Title Three" content="Updates">
  172. <meta name="text:Title Four" content="Stats">
  173. <meta name="text:Title Five" content="Blogroll">
  174. <meta name="text:Updates" content="Insert text">
  175. <meta name="text:Stats" content="Insert text">
  176. <meta name="text:Border radius" content="0px" />
  177. <meta name="text:Blog alias" content="blogalias"/>
  178. <meta name='text:Disqus Shortname' content='' />
  179.  
  180. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  181. <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  182.  
  183. <!-- CSS -->
  184.  
  185. <style type="text/css">
  186.  
  187. /* ---------------------------- GENERAL ----------------------------- */
  188.  
  189. /* -------- BASICS ------- */
  190.  
  191. body {
  192. margin: 0;
  193. padding: 0;
  194. width: 100%;
  195. height: 100%;
  196. color: {color:text};
  197. font-family: {font:Body font};
  198. font-size: {select:Body font size};
  199. line-height: -moz-calc({select:Body font size} + 5px);
  200. line-height: -webkit-calc({select:Body font size} + 5px);
  201. line-height: -o-calc({select:Body font size} + 5px);
  202. line-height: calc({select:Body font size} + 5px);
  203. background-color: {color:Background};
  204. background-image:url({image:Background});
  205. background-attachment: fixed;
  206. background-repeat: repeat;
  207. word-wrap:break-word;
  208. }
  209.  
  210.  
  211. /* Tumblr lightbox */
  212.  
  213. .tmblr-lightbox {background:rgba({RGBcolor:Background}, .95)!important;}
  214.  
  215. .tmblr-lightbox img {opacity:0;}
  216.  
  217. .lightbox-caption {
  218. color:{color:Title}!important;
  219. font-family:inherit!important;
  220. font-size:1em!important;
  221. font-weight:normal!important;
  222. text-shadow:none!important;
  223. }
  224.  
  225. .lightbox-image {
  226. -moz-box-shadow:none!important;
  227. -webkit-box-shadow:none!important;
  228. box-shadow:none!important;
  229. -moz-border-radius:0px!important;
  230. -webkit-border-radius:0px!important;
  231. border-radius:0px!important;
  232. padding:0px!important;
  233. border:0!important;
  234. opacity:1!important;
  235. }
  236.  
  237. .vignette {opacity:0!Important;}
  238.  
  239. /* Webkit scrollbar */
  240.  
  241. ::-webkit-scrollbar {
  242. width: 9px;
  243. height: 0px;
  244. }
  245.  
  246. ::-webkit-scrollbar-button:start:decrement,
  247. ::-webkit-scrollbar-button:end:increment {
  248. height: 0px;
  249. display: block;
  250. background-color: {color:Scrollbar background};
  251. border-bottom-right-radius:30px;
  252. }
  253.  
  254. ::-webkit-scrollbar-track-piece {
  255. background-color: {color:Scrollbar background};
  256. }
  257.  
  258. ::-webkit-scrollbar-thumb:vertical {
  259. height: 0px;
  260. background-color: {color:Scrollbar};
  261. border: 4px solid {color:Scrollbar background};
  262. }
  263.  
  264. /* Selection */
  265.  
  266. ::-moz-selection {
  267. background: {color:Hover};
  268. color: {color:Background};
  269. }
  270.  
  271. ::selection {
  272. background: {color:Hover};
  273. color: {color:Background};
  274. }
  275.  
  276. /* Tumblr controls */
  277.  
  278. iframe.tmblr-iframe {
  279. top:0px!important;
  280. right:35px!important;
  281. {block:ifInvertedControls}
  282. filter:invert(100%) hue-rotate(180deg);
  283. -webkit-filter:invert(100%) hue-rotate(180deg);
  284. -moz-filter:invert(100%) hue-rotate(180deg);
  285. -o-filter:invert(100%) hue-rotate(180deg);
  286. -ms-filter:invert(100%) hue-rotate(180deg);
  287. {/block:ifInvertedControls}
  288. transform:scale(0.8);
  289. transform-origin:100% 0;
  290. -webkit-transform:scale(0.8);
  291. -webkit-transform-origin:100% 0;
  292. -o-transform:scale(0.8);
  293. -o-transform-origin:100% 0;
  294. -moz-transform:scale(0.8);
  295. -moz-transform-origin:100% 0;
  296. -ms-transform:scale(0.8);
  297. -ms-transform-origin:100% 0;
  298. z-index:10000!important;
  299. }
  300.  
  301. iframe.tmblr-iframe:hover {
  302. opacity:0.6!important;
  303. }
  304.  
  305. /* Tooltips */
  306.  
  307. .ui-tooltip {
  308. position:absolute;
  309. z-index:9999;
  310. padding-top:10px;
  311. }
  312.  
  313. .ui-tooltip-content {
  314. background:{color:Background};
  315. padding:0 4px;
  316. font-style:italic;
  317. color:{color:Link};
  318. text-transform:lowercase;
  319. border:1px solid {color:Borders};
  320. }
  321.  
  322. img {
  323. opacity:1;
  324. border:0;
  325. text-decoration:none;
  326. max-width:100%;
  327. height:auto;
  328. display:block;
  329. }
  330.  
  331. /* Image style */
  332.  
  333. {block:IfFadedImages}
  334. img {
  335. -webkit-transition: opacity 0.8s linear;
  336. -moz-transition: opacity 0.8s linear;
  337. -o-transition: opacity 0.8s linear;
  338. -ms-transition: opacity 0.8s linear;
  339. opacity: 0.60;
  340. }
  341.  
  342. img:hover {
  343. -webkit-transition: opacity 0.8s linear;
  344. -moz-transition: opacity 0.8s linear;
  345. -o-transition: opacity 0.8s linear;
  346. -ms-transition: opacity 0.8s linear;
  347. opacity: 1;
  348. }
  349. {/block:IfFadedImages}
  350.  
  351. {block:IfMonochromeImages}
  352. img {
  353. -webkit-filter: grayscale(1);
  354. -webkit-transition: all 0.5s ease-in-out;
  355. -moz-transition: all 0.5s ease-in-out;
  356. -o-transition: all 0.5s ease-in-out;
  357. -ms-transition: all 0.5s ease-in-out;
  358. transition: all 0.5s ease-in-out;
  359. }
  360.  
  361. img:hover {
  362. filter: none;
  363. -webkit-filter: grayscale(0);
  364. -webkit-transition: all 0.3s ease-in-out;
  365. -moz-transition: all 0.3s ease-in-out;
  366. -o-transition: all 0.3s ease-in-out;
  367. }
  368. {/block:IfMonochromeImages}
  369.  
  370. blockquote {
  371. padding:.25em 0 .25em 15px;
  372. margin:.5em 0;
  373. border-left:1px solid {color:Borders};
  374. }
  375.  
  376. pre {
  377. padding:0;
  378. margin:0;
  379. line-height:inherit!important;
  380. background:transparent;
  381. font-family:inherit!Important;
  382. font-size:inherit!important;
  383. white-space:pre-wrap;
  384. white-space:-moz-pre-wrap;
  385. white-space:-pre-wrap;
  386. white-space:-o-pre-wrap;
  387. word-wrap:break-word;
  388. }
  389.  
  390. /* Fix */
  391.  
  392. iframe, img, embed, object, video {
  393. max-width: 100%;
  394. border: none;
  395. }
  396.  
  397. input, textarea, select, a { outline: none; }
  398.  
  399. /* Headings */
  400.  
  401. h1, h2, h3, h4 {
  402. margin:1.5em 0;
  403. font-size:1.5em;
  404. padding:0;
  405. color:{color:title};
  406. font-weight:bold;
  407. }
  408.  
  409. .entry h1:first-child, .entry h2:first-child, .entry h3:first-child, .entry h4:first-child {margin-top:0;}
  410.  
  411. /* Paragraph */
  412.  
  413. p { margin:5px 0px;}
  414.  
  415. p:first-of-type { margin-top:0;}
  416.  
  417. p:last-of-type { margin-bottom:0;}
  418.  
  419. small, big, sub, pre {
  420. font-size:1em!important;
  421. line-height:1.4em!important;
  422. vertical-align:baseline!important;
  423. }
  424.  
  425. /* Bold and italic */
  426.  
  427. b, strong, b a, strong a {
  428. font-weight:bold!important;
  429. color: {color:Bold};
  430. }
  431.  
  432. i, em {
  433. color: {color:Italic};
  434. }
  435.  
  436. /* Links */
  437.  
  438. a {
  439. color:{color:Link};
  440. text-decoration:none;
  441. transition:all .3s linear;
  442. -webkit-transition:all .3s linear;
  443. -o-transition:all .3s linear;
  444. -moz-transition:all .3s linear;
  445. }
  446.  
  447. a, a img {cursor:pointer;}
  448.  
  449. a:hover {
  450. color:{color:Hover}!important;
  451. text-decoration:none;
  452. }
  453.  
  454. ul, ol, li {
  455. margin: 5px 10px;
  456. padding: 0px;
  457. }
  458.  
  459. /* Line break */
  460.  
  461. hr {
  462. border:none;
  463. box-shadow:0;
  464. margin:2em auto;
  465. width:75px;
  466. border-top:1px solid {color:Borders};
  467. }
  468.  
  469. /* ----------------------------- CONTAINER ---------------------------*/
  470.  
  471. #container {
  472. position:relative;
  473. margin-top:40px;
  474. margin-left:auto;
  475. margin-right:auto;
  476. width:900px;
  477. z-index:0;
  478. border:3px solid {color:Container border};
  479. border-top-left-radius:100px;
  480. border-top-right-radius:100px;
  481. background:{color:Container background};
  482. min-height:2000px;
  483. padding-bottom:20px;
  484. margin-bottom:20px;
  485. margin-left:auto;
  486. margin-right:auto;
  487. z-index:10!important;
  488. }
  489.  
  490. /* -------- HEADER ------- */
  491.  
  492. #header{
  493. margin-top:0px;
  494. margin-left:auto;
  495. background:url('https://i.imgur.com/k0To2Mc.png');
  496. {block:IfHeaderBackgroundBlue}
  497. background:url('https://i.imgur.com/aJz7QJF.png');
  498. {/block:IfHeaderBackgroundBlue}
  499. margin-right:auto;
  500. border-top-left-radius:100px;
  501. border-top-right-radius:100px;
  502. width:895px;
  503. height:90px;
  504. z-index:10000000;
  505. }
  506.  
  507. /* Header links */
  508.  
  509. .mainicons{
  510. position:absolute;
  511. margin-left:35px;
  512. margin-top:30px;
  513. text-align:center;
  514. }
  515.  
  516. .mainicons i{
  517. margin-left:10px;
  518. width:15px;
  519. height:15px;
  520. padding:5px;
  521. border-radius:25px;
  522. line-height:15px;
  523. color:{color:Main icon};
  524. background:url('https://i.imgur.com/4XcqIZk.png');
  525. {block:IfMenuBackgroundBlue}
  526. background:url('https://i.imgur.com/Rw6YPUX.png');
  527. {/block:IfMenuBackgroundBlue}
  528. border:1px solid {color:Sidebar border};
  529. -webkit-transition: all .3s ease;
  530. -moz-transition: all .3s ease;
  531. -o-transition: all .3s ease;
  532. transition: all .3s ease;
  533. }
  534.  
  535. .mainicons i:hover{
  536. background: {color:Sidebar border};
  537. color:{color:Hover};
  538. }
  539.  
  540. /* Search box */
  541.  
  542. .search{
  543. position:absolute;
  544. width:165px;
  545. height:25px;
  546. margin-top:30px;
  547. margin-left:680px;
  548. background:url('https://i.imgur.com/4XcqIZk.png');
  549. {block:IfMenuBackgroundBlue}
  550. background:url('https://i.imgur.com/Rw6YPUX.png');
  551. {/block:IfMenuBackgroundBlue}
  552. border:1px solid {color:Sidebar border};
  553. border-top-right-radius:20px;
  554. border-bottom-left-radius:20px;
  555. }
  556.  
  557. .search i{
  558. position:absolute;
  559. margin-left:-23px;
  560. margin-top:7px;
  561. color:{color:Main icon};
  562. }
  563.  
  564. /* Blog title */
  565.  
  566. #blogtitle{
  567. position:absolute;
  568. margin-left:362px;
  569. margin-top:55px;
  570. padding:10px;
  571. text-align:center;
  572. height:113px;
  573. width:158px;
  574. z-index:1000000;
  575. background:url('https://i.imgur.com/cEUXSXk.png');
  576. {block:IfBlogTitleBackgroundBlue}
  577. background:url('https://i.imgur.com/XT7I9lx.png');
  578. {/block:IfBlogTitleBackgroundBlue}
  579. }
  580.  
  581. #btitle{
  582. position:absolute;
  583. top:50%;
  584. margin-left:10px;
  585. width:139px;
  586. text-align:center;
  587. line-height:40px;
  588. font-family:{select:Title Font};
  589. font-size:{select:Blog title font size};
  590. color:{color:Blog Title};
  591. -webkit-transform:translateY(-50%);
  592. -moz-transform:translateY(-50%);
  593. -ms-transform:translateY(-50%);
  594. -o-transform:translateY(-50%);
  595. transform:translateY(-50%);
  596. }
  597.  
  598. #btitle:hover{
  599. color: {color:Hover};
  600. -webkit-transition: opacity .3s linear;
  601. -webkit-transition: all .3s ease-in-out;
  602. -moz-transition: all .3s ease-in-out;
  603. -o-transition: all .3s ease-in-out;
  604. }
  605.  
  606. /* -------- MENU ------- */
  607.  
  608. #menu {
  609. margin-top:-10px;
  610. margin-left:auto;
  611. background:url('https://i.imgur.com/kctmYRz.png');
  612. {block:IfMenuBackgroundBlue}
  613. background:url('https://i.imgur.com/XHGVRHU.png');
  614. {/block:IfMenuBackgroundBlue}
  615. margin-right:auto;
  616. background-position:center;
  617. width:900px;
  618. height:80px;
  619. z-index:100000;
  620. }
  621.  
  622. #menu a{
  623. color:{color:Menu link};
  624. font-size:12px;
  625. }
  626.  
  627. /* Menu links */
  628.  
  629. #menulinkone, #menulinktwo, #menulinkthree, #menulinkfour, #menulinkfive, #menulinksix{
  630. position:absolute;
  631. margin-top:27px;
  632. width:100px;
  633. background:url('https://i.imgur.com/V6SNCVm.png');
  634. {block:IfMenuBackgroundBlue}
  635. background:url('https://i.imgur.com/6XTvTH4.png');
  636. {/block:IfMenuBackgroundBlue}
  637. height:20px;
  638. padding:2px;
  639. line-height:22px;
  640. text-align:center;
  641. border:1px solid {color:Sidebar border};
  642. border-radius:7px;
  643. -webkit-transition: all .3s ease;
  644. -moz-transition: all .3s ease;
  645. -o-transition: all .3s ease;
  646. transition: all .3s ease;
  647. }
  648.  
  649. #menulinkone{ margin-left:10px; }
  650. #menulinktwo{ margin-left:130px; }
  651. #menulinkthree{ margin-left:250px; }
  652. #menulinkfour{ margin-left:555px; }
  653. #menulinkfive{ margin-left:670px; }
  654. #menulinksix{ margin-left:785px; }
  655.  
  656. #menulinkone:hover, #menulinktwo:hover, #menulinkthree:hover, #menulinkfour:hover, #menulinkfive:hover, #menulinksix:hover{
  657. background:{color:Sidebar border};
  658. }
  659.  
  660. /* ------------- CONTAINERIN ------------- */
  661.  
  662. #containerin {
  663. position:relative;
  664. margin:30px auto;
  665. margin-bottom:10px;
  666. width:calc(230px + {select:Post width}px + 40px);
  667. height:100%;
  668. }
  669.  
  670. /* -------- SIDEBAR ------- */
  671.  
  672. #sidebar {
  673. position:absolute!important;
  674. width:180px;
  675. height:auto;
  676. margin-top:20px;
  677. margin-left:0px;
  678. {block:IfSidebarRight}
  679. margin-left:calc({select:Post width}px + 90px);
  680. {/block:IfSidebarRight}
  681. font-size:{select:Sidebar font size};
  682. line-height: -moz-calc({select:Sidebar font size} + 3px);
  683. line-height: -webkit-calc({select:Sidebar font size} + 3px);
  684. line-height: -o-calc({select:Sidebar font size} + 3px);
  685. line-height: calc({select:Sidebar font size} + 3px);
  686. overflow:visible;
  687. z-index:100;
  688. }
  689.  
  690. /* Avatar */
  691.  
  692. #avatar {
  693. position:relative;
  694. margin:0px;
  695. width:143px;
  696. height:105px;
  697. z-index:100;
  698. padding:15px 19px;
  699. background:url('https://i.imgur.com/jet6U3g.png');
  700. {block:ifAvatarBorderBlue}
  701. background:url('https://i.imgur.com/SJ0Q8Wd.png');
  702. {/block:ifAvatarBorderBlue}
  703. }
  704.  
  705. #avatar img {
  706. margin:0px;
  707. width:100%;
  708. height:100%;
  709. }
  710.  
  711. #avatar:hover {
  712. transition: all .7s ease;
  713. }
  714.  
  715. /* Sidebar titles */
  716.  
  717. .sidebartitle{
  718. position:relative;
  719. margin-left:5px;
  720. margin-top:25px;
  721. height:40px;
  722. width:173px;
  723. text-align:center;
  724. background:url('https://i.imgur.com/OhpCN4b.png');
  725. {block:IfSidebarTitleBackgroundBlue}
  726. background:url('https://i.imgur.com/AFNWChi.png');
  727. {/block:IfSidebarTitleBackgroundBlue}
  728. font-family:{select:Title font};
  729. font-size:{select:Sidebar title font size};
  730. color:{color:Sidebar title};
  731. letter-spacing:2px;
  732. line-height:50px;
  733. }
  734.  
  735. .sidebartitle:hover{
  736. color: {color:Hover};
  737. }
  738.  
  739. /* Sidebar boxes */
  740.  
  741. .sidebarbox, .navigationbox, .blogrollbox {
  742. margin-top:-10px;
  743. margin-left:5px;
  744. width:149px;
  745. height:auto;
  746. padding:10px;
  747. overflow:hidden;
  748. color:{color:Sidebar text};
  749. background:{color:Sidebar background};
  750. font-family:{select:Sidebar Font};
  751. border:2px solid {color:Sidebar border};
  752. border-bottom-left-radius:{text:Border radius};
  753. border-bottom-right-radius:{text:Border radius};
  754. }
  755.  
  756. .sidebarboxin {
  757. margin-top:10px;
  758. margin-left:0px;
  759. width:149px;
  760. max-height:185px;
  761. overflow-y:auto;
  762. border-bottom-left-radius:{text:Border radius};
  763. border-bottom-right-radius:{text:Border radius};
  764. }
  765.  
  766. .sidebarbox a{
  767. color:{color:Sidebar link};
  768. font-family:{select:Link Font};
  769. }
  770.  
  771. /* Navigation box */
  772.  
  773. .navigationbox a{
  774. display:block;
  775. width:130px;
  776. color:{color:Link};
  777. height:20px;
  778. padding:2px 5px;
  779. margin-top:3px;
  780. font-size:12px;
  781. line-height:22px;
  782. border:1px solid {color:Link post background};
  783. border-radius:5px;
  784. -webkit-transition: all .3s ease;
  785. -moz-transition: all .3s ease;
  786. -o-transition: all .3s ease;
  787. transition: all .3s ease;
  788. }
  789.  
  790. .navigationbox i{
  791. color:{color:Icon};
  792. }
  793.  
  794. .navigationbox a:hover{
  795. color:{color:Hover};
  796. background:{color:Link post background};
  797. }
  798.  
  799. /* Blogroll */
  800.  
  801. .blogrollbox img{
  802. display:inline-block;
  803. margin:2px;
  804. max-width:36px;
  805. border:2px solid {color:Borders};
  806. }
  807.  
  808. .blogrollbox img:hover{
  809. border:2px solid {color:Sidebar border};
  810. }
  811.  
  812. /* ----------------------- POSTS AND ENTRIES ----------------------------- */
  813.  
  814. #posts {
  815. margin-top:50px;
  816. margin-left:260px;
  817. {block:IfSidebarRight}
  818. margin-left:5px;
  819. {/block:IfSidebarRight}
  820. width:calc({select:Post width}px + 40px)!important;
  821. overflow:hidden;
  822. z-index:1000;
  823. }
  824.  
  825. .entry {
  826. display: inline-block;
  827. float: left;
  828. margin: 18px 0px;
  829. width: {select:Post width}px;
  830. height:auto;
  831. background:{color:Post background};
  832. overflow: hidden;
  833. border:2px solid {color:Post border};
  834. border-radius:{text:Border radius};
  835. }
  836.  
  837. .entry img { max-width: 100%; }
  838.  
  839. .content{
  840. padding: 10px;
  841. }
  842.  
  843. /* Caption */
  844.  
  845. .comment {
  846. padding:0px 10px;
  847. list-style:none;
  848. }
  849.  
  850. .comment:last-of-type { padding-bottom:0!important;}
  851.  
  852. .user {
  853. display:inline-block;
  854. line-height:1em;
  855. margin-bottom:.75em;
  856. }
  857.  
  858. .captioned .comment:first-of-type { margin-top:2em;}
  859.  
  860. /* -------- POSTS STYLES ------- */
  861.  
  862. /* Titles */
  863.  
  864. .title {
  865. margin:10px;
  866. margin-top:0px;
  867. color:{color:Title};
  868. font-family:{select:Title Font};
  869. font-size:{select:Title font size};
  870. line-height: -moz-calc({select:Title font size} + 3px);
  871. line-height: -webkit-calc({select:Title font size} + 3px);
  872. line-height: -o-calc({select:Title font size} + 3px);
  873. line-height: calc({select:Title font size} + 3px);
  874. }
  875.  
  876. .title a { color:{color:Title}; }
  877.  
  878. .title a:hover { color:{color:L ink}; }
  879.  
  880. .tex li, .tex blockquote {text-align:left; }
  881.  
  882. /* Quote posts */
  883.  
  884. .quote {
  885. margin: 10px;
  886. padding: 5px;
  887. font-family: {select:Title font};
  888. font-size: {select:Title font size};
  889. line-height: -moz-calc({select:Title font size} + 3px);
  890. line-height: -webkit-calc({select:Title font size} + 3px);
  891. line-height: -o-calc({select:Title font size} + 3px);
  892. line-height: calc({select:Title font size} + 3px);
  893. color: {color:Italic};
  894. text-align: left;
  895. letter-spacing: 2px;
  896. }
  897.  
  898. .source {
  899. font-size: 12px;
  900. line-height: 20px;
  901. }
  902.  
  903. /* Link posts */
  904.  
  905. .linkthumb img {
  906. width:100%;
  907. }
  908.  
  909. .linkp {
  910. background: {color:Link post background};
  911. padding:10px;
  912. }
  913.  
  914. .linkp i {
  915. color: {color:Title};
  916. }
  917.  
  918. /* Chat posts */
  919.  
  920. .line {
  921. margin: 5px 10px;
  922. line-height: 18px;
  923. }
  924.  
  925. /* Ask Posts */
  926.  
  927. .asker {
  928. margin: 5px;
  929. margin-top: 10px;
  930. width: -moz-calc(100% - 10px);
  931. width: -webkit-calc(100% - 10px);
  932. width: -o-calc(100% - 10px);
  933. width: calc(100% - 10px);
  934. height: auto;
  935. }
  936.  
  937. .bubble {
  938. width: -moz-calc(100% - 70px);
  939. width: -webkit-calc(100% - 70px);
  940. width: -o-calc(100% - 70px);
  941. width: calc(100% - 70px);
  942. height: auto;
  943. min-height: 35px;
  944. padding: 10px;
  945. line-height: 20px;
  946. background: {color:Ask bubble};
  947. z-index: 10;
  948. }
  949.  
  950. .triangle {
  951. position: absolute;
  952. margin-left: -moz-calc(100% - 90px);
  953. margin-left: -webkit-calc(100% - 90px);
  954. margin-left: -o-calc(100% - 90px);
  955. margin-left: calc(100% - 90px);
  956. width: 0;
  957. z-index:0;
  958. border-left: 8px solid {color:Ask bubble};
  959. border-bottom: 8px solid transparent;
  960. border-top: 8px solid transparent;
  961. }
  962.  
  963. .asker img {
  964. float: right;
  965. margin-right: 0px;
  966. max-width: 30px;
  967. border: 1.5px solid {color:Ask bubble};
  968. border-radius: 2px;
  969. z-index:1000;
  970. opacity:1;
  971. }
  972.  
  973. .answer {
  974. margin: 10px;
  975. margin-bottom: 0;
  976. }
  977.  
  978. /* ----------------------- POST INFO ----------------------------- */
  979.  
  980. .topinfo {
  981. margin:0px;
  982. width: -moz-calc(100% - 30px);
  983. width: -webkit-calc(100% - 30px);
  984. width: -o-calc(100% - 30px);
  985. width: calc(100% - 30px);
  986. height: 10px;
  987. padding: 15px;
  988. line-height: 15px;
  989. background:{color:Post info background};
  990. }
  991.  
  992. .topinfourl {
  993. margin:0;
  994. font-size: 12px;
  995. }
  996.  
  997. /* Date */
  998.  
  999. .topinfod {
  1000. float: right;
  1001. margin-top:-15px;
  1002. font-size:12px;
  1003. }
  1004.  
  1005. /* Bottom info */
  1006.  
  1007. .botinfo {
  1008. width: -moz-calc(100% - 30px);
  1009. width: -webkit-calc(100% - 30px);
  1010. width: -o-calc(100% - 30px);
  1011. width: calc(100% - 30px);
  1012. height:auto;
  1013. min-height: 50px;
  1014. margin: 0px;
  1015. padding: 15px;
  1016. padding-top: 10px;
  1017. padding-bottom: 10px;
  1018. font-size: 12px;
  1019. line-height: 25px;
  1020. color: {color:Text};
  1021. background:{color:Post info background};
  1022. overflow:hidden;
  1023. }
  1024.  
  1025. .botinfo a {
  1026. margin-right: 25px;
  1027. color: {color:Link};
  1028. }
  1029.  
  1030. .tags {
  1031. {block:IndexPage}
  1032. {block:ifNotShowTags}
  1033. display: none;
  1034. {/block:ifNotShowTags}
  1035. {/block:IndexPage}
  1036. }
  1037.  
  1038. .notec {
  1039. float: left;
  1040. }
  1041.  
  1042. /* Butttons */
  1043.  
  1044. .buttons {
  1045. float:right;
  1046. margin-top:0px;
  1047. margin-right:-5px;
  1048. width:77px;
  1049. height:26px;
  1050. line-height:26px;
  1051. z-index:100;
  1052. list-style:none;
  1053. {block:ifDisqusShortname}
  1054. width: 103px;
  1055. {/block:ifDisqusShortname}
  1056. {block:PermalinkPage}
  1057. width:52px;
  1058. {/block:PermalinkPage}
  1059. }
  1060.  
  1061. .buttons li {
  1062. display:inline-block;
  1063. margin:0;
  1064. margin-left:2px;
  1065. margin-right:0;
  1066. width:20px;
  1067. height:26px;
  1068. padding:0px;
  1069. text-align:center;
  1070. }
  1071.  
  1072. .perma i {
  1073. font-size:13px;
  1074. color:{color:Buttons};
  1075. }
  1076.  
  1077. .cmnt i {
  1078. font-size:15px;
  1079. color:{color:Buttons};
  1080. }
  1081.  
  1082. .reblog i {
  1083. font-size:17px;
  1084. color:{color:Buttons};
  1085. }
  1086.  
  1087. .like .like_button {
  1088. position:absolute;
  1089. width:100%;
  1090. height:100%;
  1091. }
  1092.  
  1093. .like .like_button iframe {
  1094. position:absolute;
  1095. top:0;
  1096. bottom:0;
  1097. left:0;
  1098. right:0;
  1099. width:100%;
  1100. height:100%;
  1101. z-index:10;
  1102. opacity:0.0000001;
  1103. }
  1104.  
  1105. .like i {
  1106. font-size:15px;
  1107. color:{color:Buttons};
  1108. }
  1109.  
  1110. .like .liked + i {
  1111. font-size:14px;
  1112. color:#D95E40;
  1113. }
  1114.  
  1115.  
  1116. /* Permalink pagination */
  1117.  
  1118. .permapag {
  1119. margin-top: 15px;
  1120. margin-left: 0px;
  1121. }
  1122.  
  1123. .permapag a{
  1124. font-size: 15px;
  1125. margin:10px;
  1126. margin-top: 20px;
  1127. padding:5px;
  1128. color:{color:Link};
  1129. }
  1130.  
  1131. /* Show/hide */
  1132.  
  1133. .clickme {
  1134. margin: 10px;
  1135. width: 130px;
  1136. color: {color:Link};
  1137. text-align: left;
  1138. cursor: pointer;
  1139. padding: 5px 10px;
  1140. border-bottom: 1.5px solid {color:Borders};
  1141. }
  1142.  
  1143. .clickme:hover {
  1144. color: {color:Hover};
  1145. background:{color:Post info background};
  1146. }
  1147.  
  1148. /* Post notes */
  1149.  
  1150. #notes {
  1151. margin: 10px;
  1152. width: 500px;
  1153. font-size: 12px;
  1154. color: {color:Text};
  1155. display:none;
  1156. }
  1157.  
  1158. ol.notes {
  1159. padding: 0px;
  1160. margin: 5px 0px;
  1161. list-style-type: none;
  1162. }
  1163.  
  1164. ol.notes li.note {
  1165. padding: 5px;
  1166. }
  1167.  
  1168. ol.notes li.note img.avatar {
  1169. float:left;
  1170. vertical-align: -5px;
  1171. width: 15px;
  1172. height: 15px;
  1173. margin-left:10px;
  1174. margin-right:10px;
  1175. }
  1176.  
  1177. li.more_notes_link_container {
  1178. text-transform: uppercase;
  1179. font-size: 12px;
  1180. }
  1181.  
  1182. /* Disqus box */
  1183.  
  1184. #disqusbox {
  1185. padding:15px;
  1186. }
  1187.  
  1188. /* ------------------- PAGINATION AND INFINITE SCROLL -------------------- */
  1189.  
  1190. #pagcon{
  1191. margin-top:20px;
  1192. margin-left:260px;
  1193. {block:IfSidebarRight}
  1194. margin-left:5px;
  1195. {/block:IfSidebarRight}
  1196. width:{select:Post width}px;
  1197. padding-top:10px;
  1198. height: 45px;
  1199. text-align: center;
  1200. border-top: 1px solid {color:Borders};
  1201. z-index:100;
  1202. }
  1203.  
  1204. /* Pagination */
  1205.  
  1206. #pagination {
  1207. width: 400px;
  1208. height: 35px;
  1209. padding-top:10px;
  1210. z-index:10000;
  1211. {block:ifInfiniteScroll}
  1212. display: none;
  1213. {/block:ifInfiniteScroll}
  1214. }
  1215.  
  1216. .previous, .next, .load-more{
  1217. display:inline;
  1218. margin-left:10px;
  1219. width:100px;
  1220. background:url('https://i.imgur.com/V6SNCVm.png');
  1221. {block:IfMenuBackgroundBlue}
  1222. background:url('https://i.imgur.com/6XTvTH4.png');
  1223. {/block:IfMenuBackgroundBlue}
  1224. height:20px;
  1225. padding:5px 10px;
  1226. font-size:12px;
  1227. line-height:22px;
  1228. text-align:center;
  1229. color:{color:Pagination};
  1230. border:1px solid {color:Sidebar border};
  1231. border-radius:7px;
  1232. -webkit-transition: all .3s ease;
  1233. -moz-transition: all .3s ease;
  1234. -o-transition: all .3s ease;
  1235. transition: all .3s ease;
  1236. }
  1237.  
  1238. .previous:hover, .next:hover, .load-more:hover{
  1239. color:{color:Hover};
  1240. }
  1241.  
  1242. .previous i, .next i, .load-more i{
  1243. color:{color:Hover};
  1244. font-size:15px;
  1245. margin:10px;
  1246. text-decoration:none;
  1247. }
  1248.  
  1249. .previous:hover i, .next:hover i, .load-more:hover i{
  1250. color:{color:Hover};
  1251. }
  1252.  
  1253. /* INFINITE SCROLL */
  1254.  
  1255. #infscr-loading {
  1256. display:none!important;
  1257. }
  1258.  
  1259. #iscon{
  1260. width: 400px!important;
  1261. height: 35px;
  1262. padding-top:10px;
  1263. z-index:100;
  1264. }
  1265.  
  1266. {block:ifLoadMore}
  1267. .load-more{
  1268. width:400px;
  1269. height:35px;
  1270. }
  1271. {/block:ifLoadMore}
  1272.  
  1273. /*-- CREDIT --*/
  1274.  
  1275. #credit {
  1276. position:fixed;
  1277. right: 10px;
  1278. width:25px;
  1279. height:25px;
  1280. top: 10px;
  1281. z-index: 100000;
  1282. }
  1283.  
  1284. #credit img{
  1285. border: 1px solid {color:Borders};
  1286. }
  1287.  
  1288. #credit img:hover{
  1289. border: 1px solid {color:Hover};
  1290. }
  1291.  
  1292. /* --------------------------- Custom CSS -------------------------- */
  1293.  
  1294. {CustomCSS}
  1295.  
  1296. </style>
  1297.  
  1298. <meta charset="utf-8">
  1299. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  1300. {block:Description}
  1301. <meta name="description" content="{MetaDescription}" />
  1302. {/block:Description}
  1303.  
  1304. </head>
  1305.  
  1306. <!------------------------------ HTML ------------------------------->
  1307.  
  1308.  
  1309. <body>
  1310.  
  1311. <div id="container">
  1312.  
  1313. <div id="header">
  1314.  
  1315. <!--Main icons-->
  1316. {block:ifShowMainIcons}
  1317. <div class="mainicons">
  1318. <a href="/" title="Home"><i class="fa fa-home"></i></a>
  1319. {block:ifAskEnabled}
  1320. <a href="/ask" title="Ask"><i class="fa fa-envelope"></i></a>
  1321. {/block:ifAskEnabled}
  1322. {block:ifSubmissionsEnabled}
  1323. <a href="/submit" title="Submit"><i class="fa fa-pencil"></i></a>
  1324. {/block:ifSubmissionsEnabled}
  1325. {block:ifShowArchiveLink}
  1326. <a href="/archive" title="Archive"><i class="fa fa-clock-o"></i></a>
  1327. {/block:ifShowArchiveLink}
  1328. </div>
  1329. {/block:ifShowMainIcons}
  1330.  
  1331. <!--Blog title-->
  1332. <div id="blogtitle">
  1333. <div id="btitle">{Title}</div>
  1334. </div>
  1335.  
  1336. <!--Search box-->
  1337. {block:ifShowSearchBox}
  1338. <div class="search">
  1339. <form action="/search" method="get">
  1340. <input type="text" name="q" value="Search" style=" float:left; margin-top:0px; margin-left:0px; width:155px; padding-left:10px; height:22px; color:{color:Main icon}; border-top-right-radius:20px; border-bottom-left-radius:20px; border:1px solid transparent; background:transparent; font-size:12px;"/><i class="fa fa-search"></i></form>
  1341. </div>
  1342. {/block:ifShowSearchBox}
  1343. </div>
  1344.  
  1345. <!--menu-->
  1346.  
  1347. <div id="menu">
  1348. {block:ifShowMenuLinkOne}
  1349. <div id="menulinkone"><a href="{text:Menu Link One url}">{text:Menu Link One}</a> </div>
  1350. {/block:ifShowMenuLinkOne}
  1351. {block:ifShowMenuLinkTwo}
  1352. <div id="menulinktwo"><a href="{text:Menu Link Two url}">{text:Menu Link Two}</a> </div>
  1353. {/block:ifShowMenuLinkTwo}
  1354. {block:ifShowMenuLinkThree}
  1355. <div id="menulinkthree"><a href="{text:Menu Link Three url}">{text:Menu Link Three}</a> </div>
  1356. {/block:ifShowMenuLinkThree}
  1357. {block:ifShowMenuLinkFour}
  1358. <div id="menulinkfour"><a href="{text:Menu Link Four url}">{text:Menu Link Four}</a> </div>
  1359. {/block:ifShowMenuLinkFour}
  1360. {block:ifShowMenuLinkFive}
  1361. <div id="menulinkfive"><a href="{text:Menu Link Five url}">{text:Menu Link Five}</a> </div>
  1362. {/block:ifShowMenuLinkFive}
  1363. {block:ifShowMenuLinkSix}
  1364. <div id="menulinksix"><a href="{text:Menu Link Six url}">{text:Menu Link Six}</a> </div>
  1365. {/block:ifShowMenuLinkSix}
  1366. </div>
  1367.  
  1368. <div id="containerin">
  1369.  
  1370. <!--Sidebar-->
  1371.  
  1372. <div id="sidebar">
  1373.  
  1374. {block:ifShowAvatar}
  1375. <div id="avatar"><img src="{image:Avatar}"></div>
  1376. {/block:ifShowAvatar}
  1377.  
  1378. {block:ifShowDescription}
  1379. <div class="sidebartitle">{text:Title One}</div>
  1380. <div class="sidebarbox">
  1381. <div class="sidebarboxin">
  1382. {Description}
  1383. </div>
  1384. <!--End sidebarboxin-->
  1385. </div>
  1386. <!--End sidebarbox-->
  1387. {/block:ifShowDescription}
  1388.  
  1389. {block:ifShowNavigation}
  1390. <div class="sidebartitle">{text:Title Two}</div>
  1391. <div class="navigationbox">
  1392. <div class="sidebarboxin">
  1393. {block:ifShowNaviLinkOne}
  1394. <a href="{text:Navi link one url}"><i class="fa fa-star"></i> {text:Navi link one}</a>
  1395. {/block:ifShowNaviLinkOne}
  1396. {block:ifShowNaviLinkTwo}
  1397. <a href="{text:Navi link two url}"><i class="fa fa-star"></i> {text:Navi link two}</a>
  1398. {/block:ifShowNaviLinkTwo}
  1399. {block:ifShowNaviLinkThree}
  1400. <a href="{text:Navi link three url}"><i class="fa fa-star"></i> {text:Navi link three}</a>
  1401. {/block:ifShowNaviLinkThree}
  1402. {block:ifShowNaviLinkFour}
  1403. <a href="{text:Navi link four url}"><i class="fa fa-star"></i> {text:Navi link four}</a>
  1404. {/block:ifShowNaviLinkFour}
  1405. {block:ifShowNaviLinkFive}
  1406. <a href="{text:Navi link five url}"><i class="fa fa-star"></i> {text:Navi link five}</a>
  1407. {/block:ifShowNaviLinkFive}
  1408. </div>
  1409. <!--End sidebarboxin-->
  1410. </div>
  1411. <!--End navigationbox-->
  1412. {/block:ifShowNavigation}
  1413.  
  1414. {block:ifShowUpdates}
  1415. <div class="sidebartitle">{text:Title Three}</div>
  1416. <div class="sidebarbox">
  1417. <div class="sidebarboxin">
  1418. {text:Updates}
  1419. </div>
  1420. <!--End sidebarboxin-->
  1421. </div>
  1422. <!--End sidebarbox-->
  1423. {/block:ifShowUpdates}
  1424.  
  1425. {block:ifShowStats}
  1426. <div class="sidebartitle">{text:Title Four}</div>
  1427. <div class="sidebarbox">
  1428. <div class="sidebarboxin">
  1429. {text:Stats}
  1430. </div>
  1431. <!--End sidebarboxin-->
  1432. </div>
  1433. <!--End sidebarbox-->
  1434. {/block:ifShowStats}
  1435.  
  1436. {block:ifShowBlogroll}
  1437. <div class="sidebartitle">{text:Title Five}</div>
  1438. <div class="blogrollbox">
  1439. <div class="sidebarboxin">
  1440. {block:Following}
  1441. {block:Followed}
  1442. <a target="_blank" href="{FollowedURL}" title="{FollowedName}">
  1443. <img src="{FollowedPortraitURL-96}" /></a>
  1444. {/block:Followed}
  1445. {/block:Following}
  1446. </div>
  1447. <!--End sidebarboxin-->
  1448. </div>
  1449. <!--End blogrollbox-->
  1450. {/block:ifShowBlogroll}
  1451.  
  1452. </div>
  1453. <!-- End sidebar -->
  1454.  
  1455.  
  1456. <!-- Posts -->
  1457. <section id="posts">
  1458.  
  1459. {block:posts}
  1460.  
  1461. <article class="entry {block:Caption}captioned{/block:Caption}">
  1462.  
  1463. {block:Date}
  1464.  
  1465. <div class="topinfo">
  1466.  
  1467. <div class="topinfourl">
  1468. {block:RebloggedFrom}
  1469. <a href="/"> {text:Blog alias}</a>
  1470. <i class="fa fa-retweet" aria-hidden="true"></i>
  1471. <a href="{ReblogParentURL}" target="_blank"> {ReblogParentName}</a>
  1472. {/block:RebloggedFrom}
  1473.  
  1474. {block:NotReblog}
  1475. <a href="/">{text:Blog alias}</a>
  1476. {/block:NotReblog}
  1477. </div>
  1478. <!-- End topinfourl-->
  1479.  
  1480. <div class="topinfod"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}"> {ShortMonth} {DayOfMonthWithZero} </a></div>
  1481.  
  1482. </div>
  1483. <!-- End topinfo-->
  1484.  
  1485. {/block:Date}
  1486.  
  1487. <!-- Text post -->
  1488. {block:Text}
  1489. <div class="content">
  1490. {block:Title}
  1491. <div class="title">{Title}</div>{/block:Title}
  1492. {block:RebloggedFrom}
  1493. {block:Reblogs}
  1494. <li class="comment {block:Title}{/block:Title}">
  1495. <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a>
  1496. <div class="tex">{body}</div>
  1497. </li>
  1498. {/block:Reblogs}
  1499. {/block:RebloggedFrom}
  1500. {block:NotReblog}
  1501. <li class="comment {block:Title}{/block:Title}">
  1502. <div class="tex">{body}</div>
  1503. </li>
  1504. {/block:NotReblog}
  1505. </div>
  1506. <!-- End content -->
  1507. {/block:Text}
  1508.  
  1509. <!-- Photo post -->
  1510. {block:Photo}
  1511. {block:IndexPage}
  1512. {LinkOpenTag}
  1513. <img src="{photoURL-HighRes}" alt="{PhotoAlt}" width="{select:Post width}px"/></a>
  1514. {LinkCloseTag}
  1515. {/block:IndexPage}
  1516. {block:PermalinkPage}
  1517. {LinkOpenTag}
  1518. <img src="{photoURL-HighRes}" alt="{PhotoAlt}" width="500px"/></a>
  1519. {LinkCloseTag}
  1520. {/block:PermalinkPage}
  1521. {/block:Photo}
  1522.  
  1523. <!-- Photoset post -->
  1524. {block:Photoset}
  1525. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  1526. {/block:Photoset}
  1527.  
  1528. <!-- Quote post -->
  1529. {block:Quote}
  1530. <div class="content">
  1531. <div class="quote">
  1532. "{Quote}"
  1533. </div>
  1534. <!-- End quote-->
  1535. <div class="source">
  1536. — {Source}
  1537. </div>
  1538. <!-- End source-->
  1539. </div>
  1540. <!-- End content -->
  1541. {/block:Quote}
  1542.  
  1543. <!-- Link post -->
  1544. {block:Link}
  1545. {block:Thumbnail}
  1546. <div class="linkthumb">
  1547. <img src="{Thumbnail}" alt="{Name}">
  1548. </div>
  1549. <!-- End linkthumb-->
  1550. {/block:Thumbnail}
  1551. <div class="linkp">
  1552. <a href="{URL}"><h1>{Name} <i class="fa fa-angle-right" aria-hidden="true"></i></h1></a>
  1553. {block:Description}
  1554. {Description}
  1555. {/block:Description}
  1556. </div>
  1557. <!-- End linkp-->
  1558. {/block:Link}
  1559.  
  1560. <!-- Chat post -->
  1561. {block:Chat}
  1562. <div class="content">
  1563. {block:Title}<h1>{Title}</h1>{/block:Title}
  1564. {block:Lines}
  1565. <div class="line">
  1566. {block:Label}<b>{Label}</b>{/block:Label} {Line}
  1567. </div>
  1568. <!-- End line-->
  1569. {/block:Lines}
  1570. </div>
  1571. <!-- End content -->
  1572. {/block:Chat}
  1573.  
  1574. <!-- Audio post -->
  1575. {block:Audio}
  1576. <div style="height: 85px">{AudioEmbed-640}</div>
  1577. {/block:Audio}
  1578.  
  1579. <!-- Video post -->
  1580. {block:Video}
  1581. {Video-500}
  1582. {/block:Video}
  1583.  
  1584. <!-- Ask post -->
  1585. {block:Answer}
  1586. <div class="content">
  1587. <div class="asker">
  1588. <img src="{AskerPortraitURL-48}">
  1589. <div class="bubble">
  1590. <div class="triangle"></div>
  1591. {Asker}:
  1592. <br>{Question}
  1593. </div>
  1594. <!-- End bubble-->
  1595. </div>
  1596. <!-- End asker -->
  1597. <div class="answer">
  1598. {Answer}
  1599. </div>
  1600. <!-- End answer -->
  1601. </div>
  1602. <!-- End content -->
  1603. {/block:Answer}
  1604.  
  1605. <!-- Caption -->
  1606. {block:Caption}
  1607. {block:Reblogs}
  1608. <li class="comment">
  1609. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} } class="user" target="_blank">{Username}</a>
  1610. <div class="tex">{Body}</div>
  1611. </li>
  1612. {/block:Reblogs}
  1613. {block:NotReblog}
  1614. <li class="comment">
  1615. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user" target="_blank">{Name}</a>
  1616. <div class="tex">{caption}</div>
  1617. </li>
  1618. {/block:NotReblog}
  1619. {/block:Caption}
  1620.  
  1621. {block:Date}
  1622.  
  1623. <div class="botinfo">
  1624.  
  1625. {block:RebloggedFrom}
  1626. {block:ContentSource}
  1627. Source: <a href="{ReblogRootURL}" target="_blank"> {ReblogRootName}</a><br>
  1628. {/block:ContentSource}
  1629. {/block:RebloggedFrom}
  1630.  
  1631. {block:HasTags}
  1632. <div class="tags">
  1633. {block:Tags}
  1634. <a href="{TagURL}">
  1635. #{Tag}</a> &nbsp;
  1636. {/block:Tags}<br>
  1637. </div>
  1638. {/block:HasTags}
  1639.  
  1640. {block:NoteCount}
  1641. <a href="{Permalink}"> {NoteCountWithLabel}</a>
  1642. {/block:NoteCount}
  1643.  
  1644. <div class="buttons">
  1645.  
  1646. {block:IndexPage}
  1647. <li class="perma"><a href="{Permalink}"><i class="fa fa-paper-plane" aria-hidden="true"></i></a></li>
  1648.  
  1649. {block:ifDisqusShortname}
  1650. <li class="cmnt"><a href="{Permalink}#disqus_thread"><i class="fa fa-comment" aria-hidden="true"></i></a></li>
  1651. {/block:ifDisqusShortname}
  1652. {/block:IndexPage}
  1653.  
  1654. <li class="reblog"><a href="{ReblogURL}"><i class="fa fa-retweet" aria-hidden="true"></i></a></li>
  1655.  
  1656. <li class="like">{LikeButton}<i class="fa fa-heart" aria-hidden="true"></i></a>
  1657.  
  1658. </div>
  1659. <!-- End buttons -->
  1660.  
  1661. </div>
  1662. <!-- End botinfo-->
  1663.  
  1664. <!--Permalink page-->
  1665. {block:PermalinkPage}
  1666.  
  1667. {block:PostNotes}
  1668.  
  1669. <div class="clickme">Show/hide post notes</div>
  1670.  
  1671. <div id="notes">
  1672. {PostNotes}
  1673. </div>
  1674. <!-- End notes-->
  1675. {/block:PostNotes}
  1676.  
  1677. {block:PermalinkPagination}
  1678. <div class="permapag">
  1679. <center>
  1680. {block:PreviousPost}
  1681. <a href="{PreviousPost}"><i class="fa fa-caret-left" aria-hidden="true"></i> Prev post</a>
  1682. {/block:PreviousPost}
  1683.  
  1684. {block:NextPost}
  1685. <a href="{NextPost}"> Next post <i class="fa fa-caret-right" aria-hidden="true"></i></a>
  1686. {/block:NextPost}
  1687. </center>
  1688. </div><br>
  1689. {/block:PermalinkPagination}
  1690.  
  1691. {block:ifDisqusShortname}
  1692. <div id="disqusbox">
  1693.  
  1694. <div id="disqus_thread"></div>
  1695. <script type="text/javascript">
  1696. /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
  1697. var disqus_shortname = '{text:Disqus Shortname}'; // Required - Enter shortname in Tumblr Theme Options
  1698. var disqus_url = '{Permalink}';
  1699.  
  1700. /* * * DON'T EDIT BELOW THIS LINE * * */
  1701. (function() {
  1702. var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
  1703. dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
  1704. (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  1705. })();
  1706. </script>
  1707. <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
  1708. <a href="https://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
  1709.  
  1710. </div>
  1711. <!-- End disqus box-->
  1712. {/block:ifDisqusShortname}
  1713.  
  1714. {/block:PermalinkPage}
  1715.  
  1716. {/block:Date}
  1717.  
  1718. </article>
  1719.  
  1720. {/block:Posts}
  1721.  
  1722. </section>
  1723.  
  1724.  
  1725. {block:Pagination}
  1726.  
  1727. <div id="pagcon">
  1728.  
  1729. <div id="pagination">
  1730. {block:PreviousPage}
  1731. <a class="previous" href="{PreviousPage}"><i class="fa fa-caret-left" aria-hidden="true"></i> NEWER </a>
  1732. {/block:PreviousPage}
  1733.  
  1734. {block:NextPage}
  1735. <a class="next" href="{NextPage}"> OLDER <i class="fa fa-caret-right" aria-hidden="true"></i></a>
  1736. {/block:NextPage}
  1737. </div>
  1738. <!-- End pagination -->
  1739.  
  1740. <div id="iscon">
  1741. {block:ifLoadMore}
  1742. <center>
  1743. <a href="#" class="load-more"> LOAD MORE <i class="fa fa-caret-down" aria-hidden="true"></i></a>
  1744. </center>
  1745. {/block:ifLoadMore}
  1746. </div>
  1747. <!-- End iscon -->
  1748.  
  1749. </div>
  1750. <!-- End pagcon -->
  1751.  
  1752. {/block:Pagination}
  1753.  
  1754. </div>
  1755. <!-- End containerin -->
  1756.  
  1757. <!-------------------------------- SCRIPTS -------------------------------->
  1758.  
  1759. <!--Google fonts -->
  1760.  
  1761. <link href="https://fonts.googleapis.com/css?family=Great+Vibes|Rouge+Script|Clicker+Script|Alex+Brush|The+Girl+Next+Door" rel="stylesheet">
  1762.  
  1763. <!-- Font awesome -->
  1764.  
  1765. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  1766.  
  1767. <!-- PXU photoset & responsive photosets -->
  1768.  
  1769. <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1770. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1771. <link href="//static.tumblr.com/wupwnyt/qWVoc4phj/resizing.css" rel="stylesheet" type="text/css"/>
  1772.  
  1773. {block:IndexPage}
  1774.  
  1775. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1776.  
  1777. {block:ifInfiniteScroll}<script src="//static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1778. {/block:ifInfiniteScroll}
  1779.  
  1780. {/block:IndexPage}
  1781.  
  1782. <script>
  1783. $(document).ready(function(){
  1784. $('.photo-slideshow').pxuPhotoset({
  1785. lightbox: true,
  1786. rounded: false,
  1787. gutter: '1px',
  1788. photoset: '.photo-slideshow',
  1789. photoWrap: '.photo-data',
  1790. photo: '.pxu-photo'
  1791. });
  1792. {block:IndexPage}
  1793. var $container = $('section');
  1794. $container.masonry({ itemSelector: 'article' });
  1795. $container.imagesLoaded(function(){
  1796. $container.masonry();
  1797. $container.find('article').animate({ opacity: 1, zIndex: 1 });
  1798. });
  1799. {block:ifInfiniteScroll}
  1800. $container.infinitescroll({
  1801. itemSelector: 'article',
  1802. navSelector: '.pagination',
  1803. nextSelector: '.next',
  1804. loadingImg: '',
  1805. loadingText: '<em></em>',
  1806. bufferPx: 2000
  1807. },
  1808. function( newElements ) {
  1809. var $newElems = $( newElements );
  1810. $newElems.find('.photo-slideshow').pxuPhotoset({
  1811. lightbox: true,
  1812. rounded: false,
  1813. gutter: '1px',
  1814. photoset: '.photo-slideshow',
  1815. photoWrap: '.photo-data',
  1816. photo: '.pxu-photo'
  1817. },
  1818. function(){
  1819. $container.masonry();
  1820. });
  1821. $newElems.imagesLoaded(function(){
  1822. $container.masonry( 'appended', $newElems );
  1823. $newElems.animate({ opacity: 1, zIndex: 1 });
  1824. });
  1825. });
  1826. {/block:ifInfiniteScroll}
  1827. $container.infinitescroll({
  1828. itemSelector: "article",
  1829. navSelector: "#pagination",
  1830. nextSelector: ".next",
  1831. loadingImg: "",
  1832. loadingText: "<em></em>",
  1833. bufferPx: 10000,
  1834. extraScrollPx: 12000,
  1835. errorCallback: function() {
  1836. $('.load-more').fadeOut();
  1837. }
  1838. }, function(newElements) {
  1839. var $newElems = $(newElements).css({
  1840. opacity: 0
  1841. });
  1842. $newElems.imagesLoaded(function() {
  1843. $newElems.animate({
  1844. opacity: 1
  1845. });
  1846. $container.masonry('appended', $newElems,
  1847. true);
  1848. });
  1849. });
  1850. {block:ifLoadMore}
  1851. $(window).unbind('.infscr');
  1852. $('.load-more').click(function() {
  1853. $container.infinitescroll('retrieve');
  1854. return false
  1855. });
  1856. {/block:ifLoadMore}
  1857. {/block:IndexPage}
  1858. });
  1859. </script>
  1860.  
  1861. <!-- Show/Hide tumblr notes -->
  1862. <script>
  1863. $(document).ready(function(){
  1864. $(".clickme").click(function(){
  1865. $("#notes").toggle(500);
  1866. });
  1867. });
  1868. </script>
  1869.  
  1870. <!-- CREDIT (do not remove) -->
  1871.  
  1872. <div id="credit"><a href="https://borntobewildcodes.tumblr.com" title="theme KAWAII DREAMS by @borntobewildcodes"><img src="https://i.imgur.com/YsnOAtA.png"></a></div>
  1873.  
  1874. {block:ContentSource}
  1875. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1876. width="{LogoWidth}" height= "{LogoHeight}" alt="{SourceTitle}" />
  1877. {/block:SourceLogo}
  1878. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1879. {/block:ContentSource}
  1880. </body>
  1881. </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!