Advertisement
hunterthemes

- Theme #8 (vol.3)

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