Advertisement
b0rn-to-be-wild

Theme: SIMPLE BEAUTY (vol.2)

Oct 23rd, 2013
3,086
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.38 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <!----
  4.  
  5. ©borntobewildcodes.tumblr.com | SIMPLE BEAUTY (vol.2)
  6.  
  7. + Do not redistribute this theme or remove the credits.
  8. + Edit as long as you keep the credits intact
  9. + Contact us if you have any questions or concerns.
  10. + If you want a custom theme you can commission us.
  11. + Thanks for using our theme, we hope that you enjoy it.
  12.  
  13.  
  14. Other credits:
  15.  
  16. - Vectors found on Google
  17.  
  18. - Jquery
  19. - Disqus
  20. - Google fonts
  21. - Font Awesome icons
  22. - Style my tooltips by Malihu
  23. - Masonry by David Desandro
  24. - Infinite scroll by Paul Irish
  25. - PXU Photosets
  26. - Masonry with Infinite Scroll and PXU Photosets tutorial by @shythemes
  27. - Load more buttons tutorial by @shythemes
  28. - Hide stuff tutorial by @lmthemes
  29. - Scroll to top tutorial found on @thetutorialsblog
  30. - Changing Like and Reblog button colors by Georgi Demirev
  31.  
  32. ---->
  33.  
  34. <html>
  35. <head>
  36.  
  37. <title>{Title}</title>
  38. <link rel="shortcut icon" href="{Favicon}">
  39. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  40.  
  41. <meta name="image:Background" content="1"/>
  42. <meta name="image:Main icons background" content="0"/>
  43. <meta name="image:Extra icons background" content="0"/>
  44. <meta name="image:Avatar" content="1"/>
  45. <meta name="image:Image 1" content="0"/>
  46. <meta name="image:Image 2" content="0"/>
  47. <meta name="image:Image 3" content="0"/>
  48. <meta name="image:Image 4" content="0"/>
  49.  
  50. <meta name="color:Background" content="#fff"/>
  51. <meta name="color:Main icons background" content="#fff"/>
  52. <meta name="color:Main icon" content="#000"/>
  53. <meta name="color:Extra icons background" content="#fff"/>
  54. <meta name="color:Extra icon" content="#000"/>
  55. <meta name="color:Blog title" content="#000"/>
  56. <meta name="color:Description" content="#000"/>
  57. <meta name="color:Buttons" content="#333"/>
  58. <meta name="color:Ask bubble" content="#E9E9E9"/>
  59. <meta name="color:Title" content="#000"/>
  60. <meta name="color:Text" content="#777"/>
  61. <meta name="color:Link" content="#000"/>
  62. <meta name="color:Hover" content="#A0D4B1"/>
  63. <meta name="color:Borders" content="#000"/>
  64. <meta name="color:Pagination" content="#000"/>
  65. <meta name="color:Scrollbar" content="#000"/>
  66. <meta name="color:Scrollbar background" content="#fff"/>
  67.  
  68. <meta name="select:Post transparency color" content="255,255,255" title="white">
  69. <meta name="select:Post transparency color" content="0,0,0" title="black">
  70. <meta name="select:Post transparency color" content="238,238,238" title="gray">
  71. <meta name="select:Post transparency color" content="255,168,212" title="pink">
  72. <meta name="select:Post transparency color" content="127,88,242" title="purple">
  73. <meta name="select:Post transparency color" content="184,168,255" title="indigo">
  74. <meta name="select:Post transparency color" content="184,208,255" title="blue">
  75. <meta name="select:Post transparency color" content="103,173,90" title="green">
  76. <meta name="select:Post transparency color" content="33,209,297" title="turquoise">
  77. <meta name="select:Post transparency color" content="226,229,23" title="yellow">
  78. <meta name="select:Post transparency color" content="112,38,11" title="brown">
  79.  
  80. <meta name="select:Post info transparency color" content="255,255,255" title="white">
  81. <meta name="select:Post info transparency color" content="0,0,0" title="black">
  82. <meta name="select:Post info transparency color" content="238,238,238" title="gray">
  83. <meta name="select:Post info transparency color" content="255,168,212" title="pink">
  84. <meta name="select:Post info transparency color" content="127,88,242" title="purple">
  85. <meta name="select:Post info transparency color" content="184,168,255" title="indigo">
  86. <meta name="select:Post info transparency color" content="184,208,255" title="blue">
  87. <meta name="select:Post info transparency color" content="103,173,90" title="green">
  88. <meta name="select:Post info transparency color" content="33,209,297" title="turquoise">
  89. <meta name="select:Post info transparency color" content="226,229,23" title="yellow">
  90. <meta name="select:Post info transparency color" content="112,38,11" title="brown">
  91.  
  92. <meta name="select:Transparency" content="1" title="opaque">
  93. <meta name="select:Transparency" content=".9" title=".9">
  94. <meta name="select:Transparency" content=".8" title=".8">
  95. <meta name="select:Transparency" content=".7" title=".7">
  96. <meta name="select:Transparency" content=".6" title=".6">
  97. <meta name="select:Transparency" content=".5" title=".5">
  98. <meta name="select:Transparency" content=".4" title=".4">
  99. <meta name="select:Transparency" content=".3" title=".3">
  100. <meta name="select:Transparency" content=".2" title=".2">
  101. <meta name="select:Transparency" content=".1" title=".1">
  102. <meta name="select:Transparency" content=".0" title="transparent">
  103.  
  104. <meta name="font:Body font" content="Helvetica"/>
  105. <meta name="select:Body font size" content="12px" title="12px">
  106. <meta name="select:Body font size" content="13px" title="13px">
  107. <meta name="select:Body font size" content="14px" title="14px">
  108. <meta name="select:Body font size" content="15px" title="15px">
  109. <meta name="select:Body font size" content="16px" title="16px">
  110.  
  111. <meta name="select:Title font" content="Tangerine" title="Tangerine">
  112. <meta name="select:Title font" content="Playball" title="Playball">
  113. <meta name="select:Title font" content="Alex Brush" title="Alex Brush">
  114. <meta name="select:Title font" content="Great Vibes" title="Great Vibes">
  115. <meta name="select:Title font" content="Sacramento" title="Sacramento">
  116.  
  117. <meta name="select:Title font size" content="22px" title="22px">
  118. <meta name="select:Title font size" content="25px" title="25px">
  119. <meta name="select:Title font size" content="27px" title="27px">
  120. <meta name="select:Title font size" content="30px" title="30px">
  121. <meta name="select:Title font size" content="32px" title="32px">
  122.  
  123. <meta name="select:Description font" content="Tangerine" title="Tangerine">
  124. <meta name="select:Description font" content="Alex Brush" title="Alex Brush">
  125. <meta name="select:Description font" content="Playball" title="Playball">
  126. <meta name="select:Description font" content="Great Vibes" title="Great Vibes">
  127. <meta name="select:Description font" content="Sacramento" title="Sacramento">
  128. <meta name="select:Description font size" content="14px" title="14px">
  129. <meta name="select:Description font size" content="16px" title="16px">
  130. <meta name="select:Description font size" content="18px" title="18px">
  131. <meta name="select:Description font size" content="20px" title="20px">
  132. <meta name="select:Description font size" content="22px" title="22px">
  133.  
  134. <meta name="select:Post width" content="540" title="540px">
  135. <meta name="select:Post width" content="500" title="500px">
  136. <meta name="select:Post width" content="400" title="400px">
  137.  
  138. <meta name="if:Inverted Controls" content="0" />
  139. <meta name="if:Infinite Scroll" content="0"/>
  140. <meta name="if:Load More" content="0"/>
  141. <meta name="if:Sidebar Position Left" content="0" />
  142. <meta name="if:Show Avatar" content="1" />
  143. <meta name="if:Show Description" content="1" />
  144. <meta name="if:Show Image 1" content="1" />
  145. <meta name="if:Show Image 2" content="1" />
  146. <meta name="if:Show Image 3" content="1" />
  147. <meta name="if:Show Image 4" content="1" />
  148. <meta name="if:Faded Images" content="0" />
  149. <meta name="if:Monochrome Images" content="0" />
  150. <meta name="if:Show Captions" content="1" />
  151. <meta name="if:Show Tags" content="1" />
  152. <meta name="if:Ask Enabled" content="1" />
  153. <meta name="if:Submissions Enabled" content="1" />
  154. <meta name="if:Show Archive" content="1" />
  155. <meta name="if:Show Random" content="1" />
  156. <meta name="if:Disqus Shortname" content="0"/>
  157.  
  158. <meta name="if:Show Link One" content="1" />
  159. <meta name="if:Show Link Two" content="1" />
  160. <meta name="if:Show Link Three" content="1" />
  161. <meta name="if:Show Link Four" content="1" />
  162. <meta name="if:Show Link Five" content="1" />
  163.  
  164. <meta name="text:Link One" content="Link one"/>
  165. <meta name="text:Link One url" content="Link One url"/>
  166. <meta name="text:Link Two" content="Link two"/>
  167. <meta name="text:Link Two url" content="Link Two url"/>
  168. <meta name="text:Link Three" content="Link three"/>
  169. <meta name="text:Link Three url" content="Link Three url"/>
  170. <meta name="text:Link Four" content="Link four"/>
  171. <meta name="text:Link Four url" content="Link Four url"/>
  172. <meta name="text:Link Five" content="Link five"/>
  173. <meta name="text:Link Five url" content="Link Five url"/>
  174.  
  175. <meta name="text:Border radius" content="0px" />
  176. <meta name="text:Blog alias" content="blogalias"/>
  177. <meta name="text:Scroll to top image url" content="http://i63.tinypic.com/mcvijc.jpg"/>
  178. <meta name='text:Disqus Shortname' content='' />
  179.  
  180. </style><style type="text/css">
  181.  
  182. /* ---------------------------- GENERAL ----------------------------- */
  183.  
  184. /* -------- BASICS ------- */
  185.  
  186.  
  187. body {
  188. margin: 0;
  189. padding: 0;
  190. width: 100%;
  191. height: 100%;
  192. color: {color:text};
  193. font-family: {font:Body font};
  194. font-size: {select:Body font size};
  195. line-height: -moz-calc({select:Body font size} + 5px);
  196. line-height: -webkit-calc({select:Body font size} + 5px);
  197. line-height: -o-calc({select:Body font size} + 5px);
  198. line-height: calc({select:Body font size} + 5px);
  199. background-color: {color:Background};
  200. background-image:url({image:Background});
  201. background-attachment: fixed;
  202. background-repeat: repeat;
  203. }
  204.  
  205. /* Fix */
  206.  
  207. iframe, img, embed, object, video {
  208. max-width: 100%;
  209. border: none;
  210. }
  211.  
  212. input, textarea, select, a { outline: none; }
  213.  
  214. /* Paragraph */
  215.  
  216. p {margin-top: 5px; margin-bottom: 5px;}
  217.  
  218. <--ses-->
  219. small{font-size: 90%;}
  220.  
  221. big{font-size: 110%;}
  222.  
  223. /* Title */
  224.  
  225. h1{
  226. margin: 0;
  227. margin-top: 10px;
  228. margin-bottom: 10px;
  229. color: {color:Title};
  230. font-family: {select:Title font};
  231. font-size: {select:Title font size};
  232. font-weight:normal;
  233. line-height: -moz-calc({select:Title font size} + 5px);
  234. line-height: -webkit-calc({select:Title font size} + 5px);
  235. line-height: -o-calc({select:Title font size} + 5px);
  236. line-height: calc({select:Title font size} + 5px);
  237. }
  238.  
  239. /* Captions */
  240.  
  241. h2 {
  242. margin-left: 10px;
  243. font-family: {font:Body font};
  244. font-size: {select:Body font size};
  245. line-height: -moz-calc({select:Body font size} + 3px);
  246. line-height: -webkit-calc({select:Body font size} + 3px);
  247. line-height: -o-calc({select:Body font size} + 3px);
  248. line-height: calc({select:Body font size} + 3px);
  249. font-weight: normal;
  250. }
  251.  
  252. /* Links */
  253.  
  254. a {
  255. color: {color:Link};
  256. text-decoration:none;
  257. }
  258.  
  259. a:hover {
  260. color: {color: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. ul, ol, li {
  269. margin: 5px 10px;
  270. padding: 0px;
  271. }
  272.  
  273. /* Bold and italic */
  274.  
  275. b, strong {
  276. color: {color:Bold};
  277. }
  278.  
  279. i, em {
  280. color: {color:Italic};
  281. }
  282.  
  283. blockquote{
  284. margin: 10px;
  285. padding-left: 10px;
  286. border-left: 1px solid {color:Borders};
  287. }
  288.  
  289. ul {
  290. margin: 0px;
  291. padding: 0px;
  292. }
  293.  
  294. a img {
  295. border: 0px;
  296. }
  297.  
  298. small {
  299. font-size: 90%;
  300. }
  301.  
  302. big {
  303. font-size: 110%;
  304. }
  305.  
  306. /* Selection */
  307.  
  308. ::-moz-selection {
  309. background: {color:Hover};
  310. color: {color:Background};
  311. }
  312.  
  313. ::selection {
  314. background: {color:Hover};
  315. color: {color:Background};
  316. }
  317.  
  318. /* Webkit scrollbar */
  319.  
  320. ::-webkit-scrollbar {
  321. width: 9px;
  322. height: 0px;
  323. }
  324.  
  325. ::-webkit-scrollbar-button:start:decrement,
  326. ::-webkit-scrollbar-button:end:increment {
  327. height: 0px;
  328. display: block;
  329. background-color: {color:Scrollbar background};
  330. }
  331.  
  332. ::-webkit-scrollbar-track-piece {
  333. background-color: {color:Scrollbar background};
  334. }
  335.  
  336. ::-webkit-scrollbar-thumb:vertical {
  337. height: 0px;
  338. background-color: {color:Scrollbar};
  339. border: 4px solid {color:Scrollbar background};
  340. }
  341.  
  342. /* Tumblr controls */
  343.  
  344. iframe.tmblr-iframe {
  345. top:0!important;
  346. right:35px!important;
  347. opacity:0.8;
  348. {block:ifInvertedControls}
  349. filter:invert(1);
  350. -webkit-filter:invert(1);
  351. -o-filter:invert(1);
  352. -moz-filter:invert(1);
  353. -ms-filter:invert(1);
  354. {/block:ifInvertedControls}
  355. transform:scale(0.8);
  356. transform-origin:100% 0;
  357. -webkit-transform:scale(0.8);
  358. -webkit-transform-origin:100% 0;
  359. -o-transform:scale(0.8);
  360. -o-transform-origin:100% 0;
  361. -moz-transform:scale(0.8);
  362. -moz-transform-origin:100% 0;
  363. -ms-transform:scale(0.8);
  364. -ms-transform-origin:100% 0;
  365. z-index:10000!important;
  366. }
  367.  
  368. iframe.tmblr-iframe:hover {
  369. opacity:0.6!important;
  370. }
  371.  
  372. /* Image style */
  373.  
  374. {block:IfFadedImages}
  375. img {
  376. -webkit-transition: opacity 0.8s linear;
  377. -moz-transition: opacity 0.8s linear;
  378. -o-transition: opacity 0.8s linear;
  379. -ms-transition: opacity 0.8s linear;
  380. opacity: 0.60;
  381. }
  382.  
  383. img:hover {
  384. -webkit-transition: opacity 0.8s linear;
  385. -moz-transition: opacity 0.8s linear;
  386. -o-transition: opacity 0.8s linear;
  387. -ms-transition: opacity 0.8s linear;
  388. opacity: 1;
  389. }
  390. {/block:IfFadedImages}
  391.  
  392. {block:IfMonochromeImages}
  393. img {
  394. -webkit-filter: grayscale(1);
  395. -webkit-transition: all 0.5s ease-in-out;
  396. -moz-transition: all 0.5s ease-in-out;
  397. -o-transition: all 0.5s ease-in-out;
  398. -ms-transition: all 0.5s ease-in-out;
  399. transition: all 0.5s ease-in-out;
  400. }
  401.  
  402. img:hover {
  403. filter: none;
  404. -webkit-filter: grayscale(0);
  405. -webkit-transition: all 0.2s ease-in-out;
  406. -moz-transition: all 0.2s ease-in-out;
  407. -o-transition: all 0.2s ease-in-out;
  408. }
  409. {/block:IfMonochromeImages}
  410.  
  411. /* Tooltips */
  412.  
  413. #s-m-t-tooltip {
  414. max-width: 250px;
  415. margin: 10px;
  416. padding: 5px;
  417. font-size: 12px;
  418. line-height: 15px;
  419. color: {color:Text};
  420. background:rgba({select:Post transparency color}, {select:Transparency});
  421. border: 1.5px solid {color:Borders};
  422. z-index: 10000;
  423. }
  424.  
  425. /* ----------------------------- CONTAINER ---------------------------*/
  426.  
  427. #container{
  428. position:relative;
  429. width:calc({select:Post width}px + 38px + 475px)!important;
  430. height:auto;
  431. margin-left:auto;
  432. margin-right:auto;
  433. }
  434.  
  435. /* ----------------------- SIDEBAR ----------------------------- */
  436.  
  437. #sidebar{
  438. position:fixed !important;
  439. top:50%;
  440. margin-left:calc({select:Post width}px + 38px + 245px);
  441. width:230px;
  442. height:auto;
  443. -webkit-transform: translateY(-50%);
  444. -moz-transform: translateY(-50%);
  445. -ms-transform: translateY(-50%);
  446. transform: translateY(-50%);
  447. text-align:center;
  448. {block:IfSidebarPositionLeft}
  449. margin-left:0px;
  450. {/block:IfSidebarPositionLeft}
  451. z-index:1000;
  452. }
  453.  
  454. /* Blog title */
  455.  
  456. #blogtitle{
  457. margin:0px;
  458. width:220px;
  459. padding:5px;
  460. color: {color:Blog title};
  461. font-family: {select:Title font};
  462. font-size: {select:Title font size};
  463. letter-spacing:2px;
  464. text-align:center;
  465. line-height:35px;
  466. text-shadow: 1px 0px {color:Borders},
  467. }
  468.  
  469. /* Avatar */
  470.  
  471. #avatar {
  472. position:relative;
  473. background:url('http://i59.tinypic.com/54d1zn.jpg');
  474. background-repeat:no-repeat;
  475. width:220px;
  476. height:230px;
  477. margin:5px auto;
  478. }
  479.  
  480. #avatar img {
  481. margin-left:3px;
  482. margin-top:25px;
  483. width:173px;
  484. height:173px;
  485. border-radius:100%;
  486. }
  487.  
  488. /* Description */
  489.  
  490. #description{
  491. margin-top:5px;
  492. margin-left:0px;
  493. width:210px;
  494. min-height:50px;
  495. max-height:120px;
  496. overflow-y:auto;
  497. color:{color:Description};
  498. font-family:{select:Description font};
  499. font-size:{select:Description font size};
  500. line-height: -moz-calc({select:Description font size} + 3px);
  501. line-height: -webkit-calc({select:Description font size} + 3px);
  502. line-height: -o-calc({select:Description font size} + 3px);
  503. line-height: calc({select:Description font size} + 3px);
  504. }
  505.  
  506. /* -------- EXTRA IMAGES ------- */
  507.  
  508. #imagecon{
  509. position:fixed;
  510. top:50%;
  511. margin-left:5px;
  512. width:120px;
  513. height:auto;
  514. -webkit-transform: translateY(-50%);
  515. -moz-transform: translateY(-50%);
  516. -ms-transform: translateY(-50%);
  517. transform: translateY(-50%);
  518. {block:IfSidebarPositionLeft}
  519. margin-left:calc({select:Post width}px + 38px + 350px)!important;
  520. {/block:IfSidebarPositionLeft}
  521. }
  522.  
  523. .image1{
  524. margin-top:0px;
  525. background:rgba({select:Post transparency color}, {select:Transparency});
  526. background-image:url('http://i42.tinypic.com/34in7d0.jpg');
  527. background-size:cover;
  528. height:120px;
  529. width:120px;
  530. }
  531.  
  532. .image2{
  533. margin-top:20px;
  534. background:rgba({select:Post transparency color}, {select:Transparency});
  535. background-image:url('http://i42.tinypic.com/34in7d0.jpg');
  536. background-size:cover;
  537. height:120px;
  538. width:120px;
  539. }
  540.  
  541. .image3{
  542. margin-top:20px;
  543. background:rgba({select:Post transparency color}, {select:Transparency});
  544. background-image:url('http://i42.tinypic.com/34in7d0.jpg');
  545. background-size:cover;
  546. height:120px;
  547. width:120px;
  548. }
  549.  
  550. .image4{
  551. margin-top:20px;
  552. background:rgba({select:Post transparency color}, {select:Transparency});
  553. background-image:url('http://i42.tinypic.com/34in7d0.jpg');
  554. background-size:cover;
  555. height:120px;
  556. width:120px;
  557. }
  558.  
  559. .image1 img, .image2 img, .image3 img, .image4 img{
  560. margin:5px;
  561. width:110px;
  562. height:110px;
  563. }
  564.  
  565. /* -------- NAVIGATION ------- */
  566.  
  567. /* Main icons */
  568.  
  569. #mainicons{
  570. position:fixed !important;
  571. top:0px;
  572. margin-left:calc({select:Post width}px + 38px + 197px);
  573. height:100%;
  574. width:35px;
  575. background-color:{color:Main icons background};
  576. background-image:url({image:Main icons background});
  577. text-align:center;
  578. border-left:1px solid {color:Borders};
  579. border-right:1px solid {color:Borders};
  580. {block:IfSidebarPositionLeft}
  581. margin-left:240px;
  582. {/block:IfSidebarPositionLeft}
  583. }
  584.  
  585. #mainicons i{
  586. display:block;
  587. margin-top:16px;
  588. color:{color:Main icon};
  589. font-size:16px;
  590. }
  591.  
  592. /* Extra icons */
  593.  
  594. #extraicons{
  595. position:fixed !important;
  596. margin-left:140px;
  597. top:0px;
  598. height:100%;
  599. width:35px;
  600. background-color:{color:Extra icons background};
  601. background-image:url({image:Extra icons background});
  602. font-size:15px;
  603. text-align:center;
  604. border-left:1px solid {color:Borders};
  605. border-right:1px solid {color:Borders};
  606. {block:IfSidebarPositionLeft}
  607. margin-left:calc({select:Post width}px + 38px + 297px)!important;
  608. {/block:IfSidebarPositionLeft}
  609. }
  610.  
  611. #extraicons i{
  612. display:block;
  613. margin-left:-3px;
  614. margin-top:15px;
  615. font-size:16px;
  616. color:{color:Extra icon};
  617. -ms-transform: rotate(90deg);
  618. -webkit-transform: rotate(90deg);
  619. transform: rotate(90deg);
  620. }
  621.  
  622. .iconcon{
  623. position:absolute;
  624. top:50%;
  625. width:35px;
  626. height:auto;
  627. -webkit-transform: translateY(-50%);
  628. -moz-transform: translateY(-50%);
  629. -ms-transform: translateY(-50%);
  630. transform: translateY(-50%);
  631. }
  632.  
  633. #mainicons:hover, #extraicons:hover{
  634. background-position:right;
  635. transition: all 0.3s ease-out;
  636. -o-transition-transition: all 0.3s ease-out;
  637. -webkit-transition: all 0.3s ease-out;
  638. -moz-transition:all;
  639. }
  640.  
  641. #mainicons i:hover, #extraicons i:hover{
  642. color:{color:Hover};
  643. }
  644.  
  645. /* ------------------ POSTS AND ENTRIES ---------------- */
  646.  
  647. #posts {
  648. position:relative;
  649. margin-top:50px;
  650. margin-left:177px;
  651. {block:IfSidebarPositionLeft}
  652. margin-left:277px;
  653. {/block:IfSidebarPositionLeft}
  654. width:calc({select:Post width}px + 58px)!important;
  655. {block:PermalinkPage}
  656. width:540px !important;
  657. {/block:PermalinkPage}
  658. z-index:100;
  659. }
  660.  
  661. .entry {
  662. display: inline-block;
  663. float: left;
  664. margin:18px 28px;
  665. height:auto;
  666. width: {select:Post width}px;
  667. background:rgba({select:Post transparency color}, {select:Transparency});
  668. border: 1.5px solid {color:Borders};
  669. border-radius:{text:Border radius};
  670. overflow: hidden;
  671. }
  672.  
  673. .entry img { max-width: 100%; }
  674.  
  675. .content{
  676. padding: 10px;
  677. }
  678.  
  679. /* -------- POSTS STYLES ------- */
  680.  
  681. /* Quote posts */
  682.  
  683. .quote {
  684. margin: 10px;
  685. padding: 5px;
  686. font-family: {select:Title font};
  687. font-size: {select:Title font size};
  688. line-height: -moz-calc({select:Title font size} + 3px);
  689. line-height: -webkit-calc({select:Title font size} + 3px);
  690. line-height: -o-calc({select:Title font size} + 3px);
  691. line-height: calc({select:Title font size} + 3px);
  692. color: {color:Italic};
  693. text-align: left;
  694. letter-spacing: 2px;
  695. }
  696.  
  697. .source {
  698. font-size: 12px;
  699. line-height: 20px;
  700. }
  701.  
  702. /* Ask Posts */
  703.  
  704. .asker {
  705. margin: 5px;
  706. margin-top: 10px;
  707. width: -moz-calc(100% - 10px);
  708. width: -webkit-calc(100% - 10px);
  709. width: -o-calc(100% - 10px);
  710. width: calc(100% - 10px);
  711. height: auto;
  712. }
  713.  
  714. .bubble {
  715. width: -moz-calc(100% - 70px);
  716. width: -webkit-calc(100% - 70px);
  717. width: -o-calc(100% - 70px);
  718. width: calc(100% - 70px);
  719. height: auto;
  720. min-height: 35px;
  721. padding: 10px;
  722. line-height: 20px;
  723. background: {color:Ask bubble};
  724. z-index:10;
  725. }
  726.  
  727. .triangle {
  728. position: absolute;
  729. margin-left: -moz-calc(100% - 90px);
  730. margin-left: -webkit-calc(100% - 90px);
  731. margin-left: -o-calc(100% - 90px);
  732. margin-left: calc(100% - 90px);
  733. width: 0;
  734. z-index:0;
  735. border-left: 8px solid {color:Ask bubble};
  736. border-bottom: 8px solid transparent;
  737. border-top: 8px solid transparent;
  738. }
  739.  
  740. .asker img {
  741. float: right;
  742. margin-right: 0px;
  743. max-width: 30px;
  744. border: 1.5px solid {color:Ask bubble};
  745. border-radius: 2px;
  746. z-index:1000;
  747. opacity:1;
  748. }
  749.  
  750. .answer {
  751. margin: 10px;
  752. margin-bottom: 0;
  753. }
  754.  
  755. /* Link posts */
  756.  
  757. .linkthumb img{
  758. width:100%;
  759. }
  760.  
  761. /* Chat posts */
  762.  
  763. .line {
  764. margin-top: 5px;
  765. line-height: 20px;
  766. }
  767.  
  768. /* ----------------------- POST INFO ----------------------------- */
  769.  
  770. .topinfo{
  771. margin:-10px;
  772. padding: 15px;
  773. width: -moz-calc(100% - 20px);
  774. width: -webkit-calc(100% - 20px);
  775. width: -o-calc(100% - 20px);
  776. width: calc(100% - 20px);
  777. height: 22px;
  778. line-height: 30px;
  779. background:rgba({select:Post info transparency color}, {select:Transparency});
  780. }
  781.  
  782. .topinfourl{
  783. margin-left: 15px;
  784. margin-top: 0px;
  785. font-size: 12px;
  786. }
  787.  
  788. /* Date */
  789.  
  790. .topinfod{
  791. float: right;
  792. padding-right: 10px;
  793. margin-top:-30px;
  794. }
  795.  
  796. /* Bottom info */
  797.  
  798. .botinfo {
  799. width: -moz-calc(100% - 30px);
  800. width: -webkit-calc(100% - 30px);
  801. width: -o-calc(100% - 30px);
  802. width: calc(100% - 30px);
  803. height:auto;
  804. min-height: 50px;
  805. margin: 0px;
  806. padding: 15px;
  807. padding-top: 10px;
  808. padding-bottom: 10px;
  809. font-size: 12px;
  810. line-height: 25px;
  811. color: {color:Text};
  812. background:rgba({select:Post info transparency color}, {select:Transparency});
  813. overflow:hidden;
  814. }
  815.  
  816. .botinfo a{
  817. margin-right: 25px;
  818. color: {color:Link};
  819. }
  820.  
  821. .tags{
  822. {block:IndexPage}
  823. {block:ifNotShowTags}
  824. display: none;
  825. {/block:ifNotShowTags}
  826. {/block:IndexPage}
  827. }
  828.  
  829. .notec{
  830. float: left;
  831. }
  832.  
  833. /* Butttons */
  834.  
  835. .buttons {
  836. float: right;
  837. width: 115px;
  838. height: 20px;
  839. margin-top: -5px;
  840. z-index: 100;
  841. list-style: none;
  842. {block:PermalinkPage}
  843. width:70px;
  844. {/block:PermalinkPage}
  845. }
  846.  
  847. .buttons li {
  848. display:inline-block;
  849. width:18px;
  850. text-align:center;
  851. margin-right:-2px;
  852. }
  853.  
  854. .perma i{
  855. font-size:14px;
  856. color:{color:Buttons};
  857. }
  858.  
  859. .comment i{
  860. font-size:15px;
  861. color:{color:Buttons};
  862. }
  863.  
  864. .reblog i{
  865. font-size:17px;
  866. color:{color:Buttons};
  867. }
  868.  
  869. .likeb svg{
  870. position:absolute;
  871. margin-left:-5px;
  872. margin-top:-7px;
  873. }
  874.  
  875. .likeb .like_button {
  876. position: absolute;
  877. opacity: 0;
  878. margin-top:-9px;
  879. margin-left:4px;
  880. }
  881.  
  882. .like .like_button.liked {
  883. opacity: 1;
  884. }
  885.  
  886. /* Permalink pagination */
  887.  
  888. .permapag{
  889. margin-top: 15px;
  890. margin-left: 0px;
  891. }
  892.  
  893. .permapag a{
  894. font-size: 15px;
  895. margin:10px;
  896. margin-top: 20px;
  897. padding:5px;
  898. color:{color:Link};
  899. }
  900.  
  901. /* Show/hide */
  902.  
  903. .clickme {
  904. margin: 10px;
  905. width: 130px;
  906. color: {color:Link};
  907. text-align: left;
  908. cursor: pointer;
  909. padding: 5px 10px;
  910. border-bottom: 1.5px solid {color:Borders};
  911. }
  912.  
  913. .clickme:hover {
  914. color: {color:Hover};
  915. background:rgba({select:Post info transparency color}, {select:Transparency});
  916. }
  917.  
  918. /* Post notes */
  919.  
  920. #notes{
  921. margin: 10px;
  922. width: 500px;
  923. font-size: 12px;
  924. color: {color:Text};
  925. display:none;
  926. }
  927.  
  928. ol.notes {
  929. padding: 0px;
  930. margin: 5px 0px;
  931. list-style-type: none;
  932. }
  933.  
  934. ol.notes li.note {
  935. padding: 5px;
  936. }
  937.  
  938. ol.notes li.note img.avatar {
  939. float:left;
  940. vertical-align: -5px;
  941. width: 15px;
  942. height: 15px;
  943. margin-left:10px;
  944. margin-right:10px;
  945. }
  946.  
  947. li.more_notes_link_container {
  948. text-transform: uppercase;
  949. font-size: 12px;
  950. }
  951.  
  952. /* Disqus box */
  953.  
  954. #disqusbox {
  955. padding:15px;
  956. }
  957.  
  958. /* ------------------- PAGINATION AND INFINITE SCROLL -------------------- */
  959.  
  960. #pagcon{
  961. margin-top: 10px;
  962. margin-left:205px;
  963. {block:IfSidebarPositionLeft}
  964. margin-left:305px;
  965. {/block:IfSidebarPositionLeft}
  966. width:{select:Post width}px;
  967. height: 45px;
  968. text-align: center;
  969. border-top: 1.5px solid {color:Borders};
  970. }
  971.  
  972. /* Pagination */
  973.  
  974. #pagination {
  975. width: 100%;
  976. height: 45px;
  977. {block:ifInfiniteScroll}
  978. display: none;
  979. {/block:ifInfiniteScroll}
  980. }
  981.  
  982. .previous, .next, .load-more{
  983. display:inline;
  984. color:{color:Pagination};
  985. font-size:12px;
  986. padding:10px;
  987. margin:10px;
  988. }
  989.  
  990. .previous:hover, .next:hover, .load-more:hover{
  991. color:{color:Hover};
  992. }
  993.  
  994. .previous i, .next i, .load-more i{
  995. color:{color:Hover};
  996. font-size:15px;
  997. margin:10px;
  998. text-decoration:none;
  999. }
  1000.  
  1001. .previous:hover i, .next:hover i, .load-more:hover i{
  1002. color:{color:Hover};
  1003. }
  1004.  
  1005. /* INFINITE SCROLL */
  1006.  
  1007. #infscr-loading {
  1008. display:none!important;
  1009. }
  1010.  
  1011. #iscon{
  1012. width:100%;
  1013. height:45px;
  1014. }
  1015.  
  1016. {block:ifLoadMore}
  1017. .load-more{
  1018. height:40px;
  1019. }
  1020. {/block:ifLoadMore}
  1021.  
  1022. /* SCROLL TO TOP */
  1023.  
  1024. #scrollToTop:link,
  1025. #scrollToTop:visited {
  1026. display: none;
  1027. position: fixed;
  1028. bottom: 0px;
  1029. right: 5px;
  1030. z-index:100000;
  1031. }
  1032.  
  1033. /*-- CREDIT --*/
  1034.  
  1035. #credit {
  1036. position:fixed;
  1037. top: 9px;
  1038. right: 10px;
  1039. width:25px;
  1040. height:25px;
  1041. z-index: 100000;
  1042. }
  1043.  
  1044. #credit img{
  1045. border: 1px solid {color:Borders};
  1046. }
  1047.  
  1048. #credit img:hover{
  1049. border: 1px solid {color:Hover};
  1050. }
  1051.  
  1052. /* --------------------------- Custom CSS -------------------------- */
  1053.  
  1054. {CustomCSS}
  1055.  
  1056. </style>
  1057.  
  1058. <!--Google fonts-->
  1059.  
  1060. <link href="https://fonts.googleapis.com/css?family=Tangerine|Playball|Alex+Brush|Great+Vibes|Sacramento" rel="stylesheet">
  1061.  
  1062. <!-- Font awesome -->
  1063.  
  1064. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  1065.  
  1066. <!--Jquery-->
  1067.  
  1068. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
  1069.  
  1070. <!-- Scroll to top -->
  1071.  
  1072. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  1073. <script type="text/javascript" src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  1074. <a href="javascript:;" id="scrollToTop" rel="nofollow" title="Go to Top"><img src="{text:Scroll to top image url}" title="Go to Top" alt="Go to Top"/></a>
  1075.  
  1076. <script src="https://static.tumblr.com/whx9ghv/lSGm6k18m/jquery.scrollto-1.4.2-min.js"></script>
  1077. <script src="https://static.tumblr.com/whx9ghv/GJEm6k188/jquery.localscroll-1.2.7-min.js"></script>
  1078.  
  1079. <script>
  1080. $(document).ready(function () {
  1081. $.localScroll();
  1082. });
  1083. </script>
  1084.  
  1085. <!-- Show/Hide tumblr notes -->
  1086.  
  1087. <script>
  1088. $(document).ready(function(){
  1089. $(".clickme").click(function(){
  1090. $("#notes").toggle(500);
  1091. });
  1092. });
  1093. </script>
  1094.  
  1095. <!-- Style my tooltips -->
  1096.  
  1097. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1098. <script>
  1099. (function($){
  1100. $(document).ready(function(){
  1101. $("a[title]").style_my_tooltips({
  1102. tip_follows_cursor:true,
  1103. tip_delay_time: 90,
  1104. tip_fade_speed: 600,
  1105. attribute:"title"
  1106. });
  1107. });
  1108. })(jQuery);
  1109. </script>
  1110.  
  1111. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  1112.  
  1113. {block:IndexPage}
  1114.  
  1115. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  1116.  
  1117. {block:ifInfiniteScroll}
  1118. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1119. {/block:ifInfiniteScroll}
  1120.  
  1121. {/block:IndexPage}
  1122.  
  1123. <script>
  1124. $(document).ready(function(){
  1125. $('.photo-slideshow').pxuPhotoset({
  1126. lightbox: true,
  1127. rounded: false,
  1128. gutter: '1px',
  1129. photoset: '.photo-slideshow',
  1130. photoWrap: '.photo-data',
  1131. photo: '.pxu-photo'
  1132. });
  1133. {block:IndexPage}
  1134. var $container = $('#posts');
  1135. $container.masonry({ itemSelector: '.entry' });
  1136. $container.imagesLoaded(function(){
  1137. $container.masonry();
  1138. $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
  1139. });
  1140. {block:ifInfiniteScroll}
  1141. $container.infinitescroll({
  1142. itemSelector: '.entry',
  1143. navSelector: '.pagination',
  1144. nextSelector: '.next',
  1145. loadingImg: '',
  1146. loadingText: '<em></em>',
  1147. bufferPx: 2000
  1148. },
  1149. function( newElements ) {
  1150. var $newElems = $( newElements );
  1151. $newElems.find('.photo-slideshow').pxuPhotoset({
  1152. lightbox: true,
  1153. rounded: false,
  1154. gutter: '1px',
  1155. photoset: '.photo-slideshow',
  1156. photoWrap: '.photo-data',
  1157. photo: '.pxu-photo'
  1158. },
  1159. function(){
  1160. $container.masonry();
  1161. });
  1162. $newElems.imagesLoaded(function(){
  1163. $container.masonry( 'appended', $newElems );
  1164. $newElems.animate({ opacity: 1, zIndex: 1 });
  1165. });
  1166. });
  1167. {/block:ifInfiniteScroll}
  1168. $container.infinitescroll({
  1169. itemSelector: ".entry",
  1170. navSelector: "#pagination",
  1171. nextSelector: ".next",
  1172. loadingImg: "",
  1173. loadingText: "<em></em>",
  1174. bufferPx: 10000,
  1175. extraScrollPx: 12000,
  1176. errorCallback: function() {
  1177. $('.load-more').fadeOut();
  1178. }
  1179. }, function(newElements) {
  1180. var $newElems = $(newElements).css({
  1181. opacity: 0
  1182. });
  1183. $newElems.imagesLoaded(function() {
  1184. $newElems.animate({
  1185. opacity: 1
  1186. });
  1187. $container.masonry('appended', $newElems,
  1188. true);
  1189. });
  1190. });
  1191. {block:ifLoadMore}
  1192. $(window).unbind('.infscr');
  1193. $('.load-more').click(function() {
  1194. $container.infinitescroll('retrieve');
  1195. return false
  1196. });
  1197. {/block:ifLoadMore}
  1198. {/block:IndexPage}
  1199. });
  1200. </script>
  1201.  
  1202. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1203.  
  1204. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1205.  
  1206. {/block:IndexPage}
  1207.  
  1208. <meta charset="utf-8">
  1209. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  1210. {block:Description}
  1211. <meta name="description" content="{MetaDescription}" />
  1212. {/block:Description}
  1213.  
  1214. </head>
  1215.  
  1216. <body>
  1217.  
  1218. <div id="container">
  1219.  
  1220. <div id="imagecon">
  1221. {block:IfShowImage1}
  1222. <div class="image1"><img src="{image:Image 1}"></div>
  1223. {/block:IfShowImage1}
  1224. {block:IfShowImage2}
  1225. <div class="image2"><img src="{image:Image 2}"></div>
  1226. {/block:IfShowImage2}
  1227. {block:IfShowImage3}
  1228. <div class="image3"><img src="{image:Image 3}"></div>
  1229. {/block:IfShowImage3}
  1230. {block:IfShowImage4}
  1231. <div class="image4"><img src="{image:Image 4}"></div>
  1232. {/block:IfShowImage4}
  1233. </div>
  1234. <!-- End imagecon-->
  1235.  
  1236. <div id="sidebar">
  1237.  
  1238. <div id="blogtitle">{Title}</div>
  1239.  
  1240. {block:IfShowAvatar}
  1241. <div id="avatar"><img src="{image:Avatar}"></div>
  1242. {/block:IfShowAvatar}
  1243.  
  1244. {block:IfShowDescription}
  1245. <div style="position: relative; margin-left: 0px; margin-top: 10px;"><img src="http://i62.tinypic.com/i2lxyb.jpg"> </div>
  1246. <div id="description">{Description}</div>
  1247. <div style="position: relative; margin-left: 0px; margin-top: 5px;"><img src="http://i57.tinypic.com/91jts4.jpg"> </div>
  1248. {/block:IfShowDescription}
  1249.  
  1250. </div>
  1251. <!--End sidebar-->
  1252.  
  1253. <div id="mainicons">
  1254. <div class="iconcon">
  1255. <a href="/" Title="Index"><i class="fa fa-home fa"></i></a>
  1256. {block:ifAskEnabled}
  1257. <a href="/ask"><a href="/ask" Title="Message"><i class="fa fa-envelope fa"></i></a>
  1258. {/block:ifAskEnabled}
  1259. {block:IfSubmissionsEnabled}
  1260. <a href="/submit"><a href="/submit" Title="Submit"><i class="fa fa-pencil fa"></i></a>
  1261. {/block:IfSubmissionsEnabled}
  1262. {block:IfShowArchive}
  1263. <a href="/archive"><a href="/archive" Title="Archive"><i class="fa fa-history fa"></i></a>
  1264. {/block:IfShowArchive}
  1265. {block:IfShowRandom}
  1266. <a href="/random" Title="Random"><i class="fa fa-star fa"></i></a>
  1267. {/block:IfShowRandom}
  1268. </div>
  1269. <!--End iconcon-->
  1270. </div>
  1271. <!--End mainicons-->
  1272.  
  1273. <div id="extraicons">
  1274. <div class="iconcon">
  1275. {block:IfShowLinkOne}
  1276. <a href="{text:Link One url}" Title="{text:Link One}"><i class="fa fa-heart fa"></i></a>
  1277. {/block:IfShowLinkOne}
  1278. {block:IfShowLinkTwo}
  1279. <a href="{text:Link Two url}" Title="{text:Link Two}"><i class="fa fa-heart fa"></i></a>
  1280. {/block:IfShowLinkTwo}
  1281. {block:IfShowLinkThree}
  1282. <a href="{text:Link Three url}" Title="{text:Link Three}"><i class="fa fa-heart fa"></i></a>
  1283. {/block:IfShowLinkThree}
  1284. {block:IfShowLinkFour}
  1285. <a href="{text:Link Four url}" Title="{text:Link Four}"><i class="fa fa-heart fa"></i></a>
  1286. {/block:IfShowLinkFour}
  1287. {block:IfShowLinkFive}
  1288. <a href="{text:Link Five url}" Title="{text:Link Five}"><i class="fa fa-heart fa"></i></a>
  1289. {/block:IfShowLinkFive}
  1290. </div>
  1291. <!--End iconcon-->
  1292. </div>
  1293. <!--End extraicons-->
  1294.  
  1295. <!-- Posts -->
  1296. <div id="posts">
  1297.  
  1298. {block:Posts}
  1299.  
  1300. <div class="entry">
  1301.  
  1302. {block:Date}
  1303.  
  1304. <div class="topinfo">
  1305.  
  1306. <div class="topinfourl">
  1307. {block:RebloggedFrom}
  1308. <a href="/"> {text:Blog alias}</a>
  1309. <i class="fa fa-retweet" aria-hidden="true"></i>
  1310. <a href="{ReblogParentURL}" target="_blank"> {ReblogParentName}</a>
  1311. {/block:RebloggedFrom}
  1312.  
  1313. {block:NotReblog}
  1314. <a href="/">{text:Blog alias}</a>
  1315. {/block:NotReblog}
  1316. </div>
  1317. <!--End topinfourl-->
  1318.  
  1319. <div class="topinfod"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}"> {ShortMonth} {DayOfMonthWithZero} </a></div>
  1320.  
  1321. </div>
  1322. <!--End topinfo-->
  1323.  
  1324. {/block:Date}
  1325.  
  1326. <!-- Text post -->
  1327. {block:Text}
  1328. <div class="content">
  1329. {block:Title}
  1330. <a href="{Permalink}">
  1331. <h1>{Title}</h1></a>
  1332. {/block:Title}
  1333. {Body}
  1334. </div>
  1335. <!--End content-->
  1336. {/block:Text}
  1337.  
  1338. <!-- Photo post -->
  1339. {block:Photo}
  1340. {block:IndexPage}
  1341. {LinkOpenTag}
  1342. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="{select:Post width}px"/></a>
  1343. {LinkCloseTag}
  1344. {/block:IndexPage}
  1345. {block:PermalinkPage}
  1346. {LinkOpenTag}
  1347. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500px"/></a>
  1348. {LinkCloseTag}
  1349. {/block:PermalinkPage}
  1350. {/block:Photo}
  1351.  
  1352. <!-- Photoset post -->
  1353. {block:Photoset}
  1354. <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>
  1355. {/block:Photoset}
  1356.  
  1357. <!-- Chat post -->
  1358. {block:Chat}
  1359. <div class="content">
  1360. {block:Title}<h1>{Title}</h1>{/block:Title}
  1361. {block:Lines}
  1362. <div class="line">
  1363. {block:Label}<b>{Label}</b>{/block:Label} {Line}
  1364. </div>
  1365. <!--End line-->
  1366. {/block:Lines}
  1367. </div>
  1368. <!--End content-->
  1369. {/block:Chat}
  1370.  
  1371. <!-- Quote post -->
  1372. {block:Quote}
  1373. <div class="content">
  1374. <div class="quote">
  1375. "{Quote}"
  1376. </div>
  1377. <!--End quote-->
  1378. <div class="source">
  1379. — {Source}
  1380. </div>
  1381. <!--End source-->
  1382. </div>
  1383. <!--End content-->
  1384. {/block:Quote}
  1385.  
  1386. <!-- Link post -->
  1387. {block:Link}
  1388. <div class="content">
  1389. {block:Thumbnail}
  1390. <div class="linkthumb">
  1391. <img src="{Thumbnail}" alt="{Name}">
  1392. </div>
  1393. <!--End linkthumb-->
  1394. {/block:Thumbnail}
  1395. <a href="{URL}"><h1>{Name}</h1></a>
  1396. {block:Description}
  1397. <p>{Description}</p>
  1398. {/block:Description}
  1399. </div>
  1400. <!--End content-->
  1401. {/block:Link}
  1402.  
  1403. <!-- Video post -->
  1404. {block:Video}
  1405. {Video-700}
  1406. {/block:Video}
  1407.  
  1408. <!-- Audio post -->
  1409. {block:Audio}
  1410. <div style="height: 85px">{AudioEmbed-640}</div>
  1411. <!--End content-->
  1412. {/block:Audio}
  1413.  
  1414. <!-- Ask post -->
  1415. {block:Answer}
  1416. <div class="content">
  1417. <div class="asker">
  1418. <img src="{AskerPortraitURL-48}">
  1419. <div class="bubble" style="border-color: {color:Ask bubble}; background: {color:Ask bubble};">
  1420. <div class="triangle"></div>
  1421. {Asker}asked:
  1422. <br>{Question}
  1423. </div>
  1424. <!--End bubble-->
  1425. </div>
  1426. <!--End asker-->
  1427. <div class="answer">
  1428. {Answer}
  1429. </div>
  1430. <!--End answer-->
  1431. </div>
  1432. <!--End content-->
  1433. {/block:Answer}
  1434.  
  1435. {block:Caption}
  1436. <h2>{Caption}</h2>
  1437. {/block:Caption}
  1438.  
  1439. {block:Date}
  1440.  
  1441. <div class="botinfo">
  1442.  
  1443. {block:RebloggedFrom}
  1444. {block:ContentSource}
  1445. Source: <a href="{ReblogRootURL}" target="_blank"> {ReblogRootName}</a><br>
  1446. {/block:ContentSource}
  1447. {/block:RebloggedFrom}
  1448.  
  1449. {block:HasTags}
  1450. <div class="tags">
  1451. {block:Tags}
  1452. <a href="{TagURL}">
  1453. #{Tag}</a> &nbsp;
  1454. {/block:Tags}<br>
  1455. </div>
  1456. {/block:HasTags}
  1457.  
  1458. {block:NoteCount}
  1459. <a href="{Permalink}"> {NoteCountWithLabel}</a>
  1460. {/block:NoteCount}
  1461.  
  1462. <div class="buttons">
  1463.  
  1464. {block:IndexPage}
  1465. <li class="perma"><a href="{Permalink}"><i class="fa fa-paper-plane" aria-hidden="true"></i></a></li>
  1466.  
  1467. <li class="comment"><a href="{Permalink}#disqus_thread"><i class="fa fa-comment" aria-hidden="true"></i></a></li>
  1468. {/block:IndexPage}
  1469.  
  1470. <li class="reblog"><a href="{ReblogURL}"><i class="fa fa-retweet" aria-hidden="true"></i></a></li>
  1471.  
  1472. <li class="likeb"><svg width="14" height="14" viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="{color:Buttons}"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>{LikeButton size="14"}</li>
  1473.  
  1474. </div>
  1475. <!--End Buttons-->
  1476. </div>
  1477. <!--End botinfo-->
  1478.  
  1479. <!--Permalink page-->
  1480. {block:PermalinkPage}
  1481.  
  1482. {block:PostNotes}
  1483.  
  1484. <div class="clickme">Show/hide post notes</div>
  1485.  
  1486. <div id="notes">
  1487. {PostNotes}
  1488. </div>
  1489. <!--End notes-->
  1490. {/block:PostNotes}
  1491.  
  1492. {block:PermalinkPagination}
  1493. <div class="permapag">
  1494. <center>
  1495. {block:PreviousPost}
  1496. <a href="{PreviousPost}"><i class="fa fa-caret-left" aria-hidden="true"></i> Prev post</a>
  1497. {/block:PreviousPost}
  1498.  
  1499. {block:NextPost}
  1500. <a href="{NextPost}"> Next post <i class="fa fa-caret-right" aria-hidden="true"></i></a>
  1501. {/block:NextPost}
  1502. </center>
  1503. </div><br>
  1504. {/block:PermalinkPagination}
  1505.  
  1506. {block:IfDisqusShortname}
  1507. <div id="disqusbox">
  1508.  
  1509. <div id="disqus_thread"></div>
  1510. <script type="text/javascript">
  1511. /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
  1512. var disqus_shortname = '{text:Disqus Shortname}'; // Required - Enter shortname in Tumblr Theme Options
  1513. var disqus_url = '{Permalink}';
  1514.  
  1515. /* * * DON'T EDIT BELOW THIS LINE * * */
  1516. (function() {
  1517. var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
  1518. dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
  1519. (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  1520. })();
  1521. </script>
  1522. <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
  1523. <a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
  1524.  
  1525. </div>
  1526. <!--End disqus box-->
  1527. {/block:IfDisqusShortname}
  1528.  
  1529. {/block:PermalinkPage}
  1530.  
  1531. {/block:Date}
  1532.  
  1533. <!-- No via and source in captions -->
  1534. {block:ContentSource}
  1535. <!-- {SourceURL}
  1536. {block:SourceLogo}
  1537. <img src="{BlackLogoURL}"
  1538. width="{LogoWidth}"
  1539. height="{LogoHeight}"
  1540. alt="{SourceTitle}" />
  1541. {/block:SourceLogo}
  1542. {block:NoSourceLogo}
  1543. {SourceLink}
  1544. {/block:NoSourceLogo} -->
  1545. {/block:ContentSource}
  1546.  
  1547. </div>
  1548. <!--End entry-->
  1549.  
  1550. {/block:Posts}
  1551. </div>
  1552. <!-- End posts -->
  1553.  
  1554. {block:Pagination}
  1555.  
  1556. <div id="pagcon">
  1557.  
  1558. <div id="pagination">
  1559. {block:PreviousPage}
  1560. <a class="previous" href="{PreviousPage}"><i class="fa fa-caret-left" aria-hidden="true"></i> NEWER </a>
  1561. {/block:PreviousPage}
  1562.  
  1563. {block:NextPage}
  1564. <a class="next" href="{NextPage}"> OLDER <i class="fa fa-caret-right" aria-hidden="true"></i></a>
  1565. {/block:NextPage}
  1566. </div>
  1567. <!--End pagination-->
  1568.  
  1569. <div id="iscon">
  1570. {block:ifLoadMore}
  1571.  
  1572. <a href="#" class="load-more"> LOAD MORE <i class="fa fa-caret-down" aria-hidden="true"></i></a>
  1573. {/block:ifLoadMore}
  1574. </div>
  1575.  
  1576. </div>
  1577. <!--End pagcon-->
  1578.  
  1579. {/block:Pagination}
  1580.  
  1581. </div>
  1582. <!--End container-->
  1583.  
  1584. <!-- CREDIT (do not remove) -->
  1585.  
  1586. <div id="credit"><a href="http://borntobewildcodes.tumblr.com" title="theme SIMPLE BEAUTY by @borntobewildcodes"><img src="http://i57.tinypic.com/301g6eg.jpg"></a></div>
  1587.  
  1588. </body>
  1589. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement