Advertisement
hunterthemes

- Theme #24

Aug 12th, 2016
167
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.97 KB | None | 0 0
  1. <html>
  2.  
  3. <!----
  4.  
  5. © hunterthemes.tumblr.com | Theme #24
  6.  
  7. * Do not redistribute this theme and claim it as your own.
  8. * Do not remove the credit or move it to another page.
  9. * Minor changes to this theme are allowed.
  10.  
  11. ---->
  12.  
  13. <!-- GOOGLE FONTS -->
  14.  
  15. <link href='http://fonts.googleapis.com/css?family=Play' rel='stylesheet' type='text/css'>
  16. <link href='http://fonts.googleapis.com/css?family=Overlock' rel='stylesheet' type='text/css'>
  17. <link href='http://fonts.googleapis.com/css?family=Baumans' rel='stylesheet' type='text/css'>
  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.  
  21. <!-- DEFAULT VARIABLES -->
  22.  
  23. <meta name="image:Background" content="" />
  24. <meta name="image:Avatar" content="" />
  25. <meta name="image:Header background" content="" />
  26.  
  27. <meta name="color:Background" content="#fff" />
  28. <meta name="color:Profile background" content="#fff" />
  29. <meta name="color:Blog title" content="#000" />
  30. <meta name="color:Profile link" content="#777" />
  31. <meta name="color:Profile icon" content="#333" />
  32. <meta name="color:Main link" content="#000" />
  33. <meta name="color:Description" content="#333" />
  34. <meta name="color:Popup box background" content="#fff" />
  35. <meta name="color:Popup box link" content="#777" />
  36. <meta name="color:Popup box icon" content="#333" />
  37. <meta name="color:Post background" content="#fff" />
  38. <meta name="color:Title" content="#000000" />
  39. <meta name="color:Text" content="#000000" />
  40. <meta name="color:Bold" content="#000"/>
  41. <meta name="color:Italic" content="#ddd"/>
  42. <meta name="color:Link" content="#333" />
  43. <meta name="color:Icon" content="#333" />
  44. <meta name="color:Hover" content="#ccc" />
  45. <meta name="color:Chat 1" content="#f8f8f8" />
  46. <meta name="color:Chat 2" content="#cfcfcf" />
  47. <meta name="color:Borders" content="#ddd" />
  48. <meta name="color:Pagination" content="#ddd" />
  49. <meta name="color:Answer" content="#000"/>
  50. <meta name="color:Scrollbar" content="#000000" />
  51.  
  52. <meta name="select:Title font" content="Play" title="Play">
  53. <meta name="select:Title font" content="Overlock" title="Overlock">
  54. <meta name="select:Title font" content="Baumans" title="Baumans">
  55. <meta name="select:Title font" content="Poiret One" title="Poiret One">
  56. <meta name="select:Title font" content="Nova Slim" title="Nova Slim">
  57.  
  58. <meta name="select:Title font size" content="20px" title="20px">
  59. <meta name="select:Title font size" content="25px" title="25px">
  60. <meta name="select:Title font size" content="30px" title="30px">
  61. <meta name="select:Title font size" content="35px" title="35px">
  62. <meta name="select:Title font size" content="40px" title="40px">
  63.  
  64. <meta name="select:Blog title font size" content="15px" title="15px">
  65. <meta name="select:Blog title font size" content="20px" title="20px">
  66. <meta name="select:Blog title font size" content="22px" title="22px">
  67. <meta name="select:Blog title font size" content="25px" title="25px">
  68. <meta name="select:Blog title font size" content="30px" title="30px">
  69.  
  70. <meta name="font:Body font" content="Helvetica"/>
  71. <meta name="select:Body font size" content="11px" title="11px">
  72. <meta name="select:Body font size" content="12px" title="12px">
  73. <meta name="select:Body font size" content="13px" title="13px">
  74. <meta name="select:Body font size" content="14px" title="14px">
  75. <meta name="select:Body font size" content="15px" title="15px">
  76.  
  77. <meta name="if:Infinite Scrolling" content="0" />
  78. <meta name="if:700px Posts" content="0" />
  79. <meta name="if:Show Avatar" content="1" />
  80. <meta name="if:Show Main Links" content="1" />
  81. <meta name="if:Show Captions" content="1" />
  82. <meta name="if:Show Tags" content="1" />
  83. <meta name="if:Show Search Box" content="1" />
  84.  
  85. <meta name="text:Blog alias" content="Blog alias" />
  86.  
  87. <meta name="if:Show Link One" content="1" />
  88. <meta name="if:Show Link Two" content="1" />
  89. <meta name="if:Show Link Three" content="1" />
  90. <meta name="if:Show Link Four" content="1" />
  91. <meta name="if:Show Link Five" content="1" />
  92.  
  93. <meta name="text:Link One Title" content="Link One" />
  94. <meta name="text:Link One Url" content="http://"/>
  95. <meta name="text:Link Two Title" content="Link Two"/>
  96. <meta name="text:Link Two Url" content="http://"/>
  97. <meta name="text:Link Three Title" content="Link Three" />
  98. <meta name="text:Link Three Url" content="http://" />
  99. <meta name="text:Link Four Title" content="Link Four" />
  100. <meta name="text:Link Four Url" content="http://" />
  101. <meta name="text:Link Five Title" content="Link Five" />
  102. <meta name="text:Link Five Url" content="http://" />
  103.  
  104. <meta name="if:ShowFacebook" content="1" />
  105. <meta name="if:ShowTwitter" content="1" />
  106. <meta name="if:ShowGoogleplus" content="1" />
  107. <meta name="if:ShowDeviantart" content="1" />
  108. <meta name="if:ShowFlickr" content="1" />
  109.  
  110. <meta name="text:Facebook url" content="http://" />
  111. <meta name="text:Twitter url" content="http://" />
  112. <meta name="text:Googleplus url" content="http://" />
  113. <meta name="text:Deviantart url" content="http://" />
  114. <meta name="text:Flickr url" content="http://" />
  115.  
  116. <!-- END DEFAULT VARIABLES -->
  117.  
  118. <head>
  119. <style type="text/css">
  120.  
  121. /* CSS */
  122.  
  123. /*-- GENERAL --*/
  124.  
  125. body {
  126. margin:0;
  127. padding:0;
  128. width:100%;
  129. height:100%;
  130. word-wrap:break-word;
  131. color:{color:Text};
  132. font-family:{font:Body font};
  133. font-size:{select:Body font size};
  134. line-height: -moz-calc({select:Body font size} + 3px);
  135. line-height: -webkit-calc({select:Body font size} + 3px);
  136. line-height: -o-calc({select:Body font size} + 3px);
  137. line-height: calc({select:Body font size} + 3px);
  138. background-color: {color:Background};
  139. background-image:url({image:Background});
  140. background-attachment: fixed;
  141. background-repeat: repeat;
  142. }
  143.  
  144. h1{
  145. margin:0;
  146. margin-bottom:10px;
  147. padding:10px;
  148. color:{color:Title};
  149. font-family:{select:Title font};
  150. font-size:{select:Title font size};
  151. background:{color:Borders};
  152. font-weight:normal;
  153. line-height: -moz-calc({select:Title font size} + 3px);
  154. line-height: -webkit-calc({select:Title font size} + 3px);
  155. line-height: -o-calc({select:Title font size} + 3px);
  156. line-height: calc({select:Title font size} + 3px);
  157. border-bottom:1px solid {color:Borders};
  158. }
  159.  
  160. h2{
  161. padding:10px;
  162. font-family:{font:Body font};
  163. font-size:{select:Body font size};
  164. font-weight:normal;
  165. line-height: -moz-calc({select:Body font size} + 3px);
  166. line-height: -webkit-calc({select:Body font size} + 3px);
  167. line-height: -o-calc({select:Body font size} + 3px);
  168. line-height: calc({select:Body font size} + 3px);
  169. }
  170.  
  171. a {
  172. color:{color:Link};
  173. text-decoration:none;
  174. }
  175.  
  176. a:hover {
  177. text-decoration:none;
  178. color:{color:Link Hover};
  179. -webkit-transition: all 0.5s ease-in-out;
  180. -moz-transition: all 0.6s ease-in-out;
  181. -o-transition: all 0.5s ease-in-out;
  182. transition: all 0.6s ease-in-out;
  183. }
  184.  
  185. blockquote{
  186. padding:0px 0px 2px 5px;
  187. margin:0px 0px 2px 10px;
  188. border-left: 1px dotted #555555;
  189. }
  190.  
  191. b, strong {color:{color:Bold};}
  192.  
  193. i, em {color:{color:Italic};}
  194.  
  195. /*-- TUMBLR CONTROLS --*/
  196.  
  197. .iframe-controls--desktop {
  198. position: fixed !important;
  199. margin-top:10px !important;
  200. right:40px !important;
  201. z-index:1000000 !important;
  202. opacity:.7 !important;
  203. filter: invert(1);
  204. -webkit-filter: invert(1);
  205. -moz-filter: invert(1);
  206. -o-filter: invert(1);
  207. -ms-filter: invert(1);
  208. }
  209.  
  210. .iframe-controls--desktop:hover {
  211. opacity: 1;
  212. color:{color:Hover};
  213. background:transparent;
  214. -webkit-transition: opacity 0.7s linear;
  215. -webkit-transition: all 0.5s ease-out;
  216. -moz-transition: all 0.5s ease-out;
  217. transition: all 0.5s ease-out;
  218. }
  219.  
  220. /*-- WEBKIT SCROLLBAR--*/
  221.  
  222. ::-webkit-scrollbar {
  223. width: 9px;
  224. height: 0px;
  225. }
  226.  
  227. ::-webkit-scrollbar-button:start:decrement,
  228. ::-webkit-scrollbar-button:end:increment {
  229. height: 0px;
  230. display: block;
  231. background-color: {color:Borders};
  232. }
  233.  
  234. ::-webkit-scrollbar-track-piece {
  235. background-color: {color:Borders};
  236. }
  237.  
  238. ::-webkit-scrollbar-thumb:vertical {
  239. height: 0px;
  240. background-color: {color:Scrollbar};
  241. border:4px solid {color:Borders};
  242. }
  243.  
  244. /*-- TOOLTIPS --*/
  245.  
  246. #s-m-t-tooltip {
  247. max-width:300px;
  248. z-index:10000;
  249. margin:24px 14px 7px 12px;
  250. padding:8px;
  251. color:{color:Main link};
  252. border:1px solid {color:Borders};
  253. font-size:13px;
  254. line-height:16px;
  255. }
  256.  
  257. /*-- PERMALINK PAGE --*/
  258.  
  259. .notes{
  260. padding-top:30px;
  261. width:500px;
  262. line-height:20px;
  263. }
  264.  
  265. .postnotes{
  266. margin-top:20px;
  267. }
  268.  
  269. ol.notes {
  270. padding: 0px;
  271. margin: 10px 0px;
  272. list-style-type: none;
  273. }
  274.  
  275. ol.notes li.note {
  276. padding: 10px;
  277. border-bottom:1px solid {color:Borders};
  278. }
  279.  
  280. ol.notes li.note img.avatar {
  281. vertical-align: -5px;
  282. margin-right: 10px;
  283. width: 15px;
  284. height: 15px;
  285. }
  286.  
  287. /*------ HEADER -----*/
  288.  
  289. #header{
  290. position:absolute;
  291. top:50%;
  292. left:50%;
  293. margin-top:0px;
  294. width:500px;
  295. height:240px;
  296. border:1px solid {color:Borders};
  297. background-image:url({image:Header background});
  298. {block:if700pxPosts}
  299. width:700px;
  300. height:310px;
  301. {/block:if700pxPosts}
  302. -webkit-transform: translateX(-50%) translateY(-50%);
  303. -moz-transform: translateX(-50%) translateY(-50%);
  304. -ms-transform: translateX(-50%) translateY(-50%);
  305. transform: translateX(-50%) translateY(-50%);
  306. }
  307.  
  308. /* Menu */
  309.  
  310. #menu{
  311. margin-top:165px;
  312. margin-left:64px;
  313. width:90px;
  314. height:29px;
  315. padding:5px;
  316. line-height:29px;
  317. z-index:1;
  318. text-align:center;
  319. {block:if700pxPosts}
  320. margin-top:200px;
  321. margin-left:123px;
  322. {/block:if700pxPosts}
  323. }
  324.  
  325. #menu a{
  326. display:inline-block;
  327. margin:5px;
  328. width:6px;
  329. height:6px;
  330. border:1px solid {color:Borders};
  331. border-radius:5px;
  332. }
  333.  
  334. #menu a:hover{
  335. background:{color:Hover};
  336. -webkit-transition: all .7s ease;
  337. -moz-transition: all .7s ease;
  338. -o-transition: all .7s ease;
  339. transition: all .7s ease;
  340. }
  341.  
  342. /*-- PROFILE --*/
  343.  
  344. #profile{
  345. position:absolute;
  346. margin-top:0px;
  347. margin-left:190px;
  348. height: 0px;
  349. width: 200px;
  350. border-bottom: 240px solid {color:Profile background};
  351. border-left: 110px solid transparent;
  352. z-index:10;
  353. {block:if700pxPosts}
  354. margin-left:280px;
  355. width:300px;
  356. border-bottom: 310px solid {color:Profile background};
  357. border-left: 120px solid transparent;
  358. {/block:if700pxPosts};
  359. }
  360.  
  361. #profile:hover{
  362. margin-left:0px;
  363. width:260px;
  364. padding-left:140px;
  365. border-left: 100px solid {color:Profile background};
  366. -webkit-transition: all 0.5s ease-in-out;
  367. -moz-transition: all 0.6s ease-in-out;
  368. -o-transition: all 0.5s ease-in-out;
  369. transition: all 0.6s ease-in-out;
  370. {block:if700pxPosts}
  371. width:360px;
  372. padding-left:140px;
  373. border-left: 200px solid {color:Profile background};
  374. {/block:if700pxPosts}
  375. }
  376.  
  377. /* Avatar */
  378.  
  379. #avatar {
  380. position:absolute;
  381. top:71px;
  382. left:-230px;
  383. width:68px;
  384. height:68px;
  385. padding:10px;
  386. border:1px solid {color:Borders};
  387. z-index:1000;
  388. {block:if700pxPosts}
  389. top:100px;
  390. left:-270px;
  391. {/block:if700pxPosts}
  392. }
  393.  
  394. #avatar img {
  395. width:100%;
  396. height:100%;
  397. border:1px solid {color:Borders};
  398. }
  399.  
  400. #avatar:hover{
  401. padding:0px;
  402. width:88px;
  403. height:88px;
  404. -webkit-transition: all 0.5s ease-in-out;
  405. -moz-transition: all 0.6s ease-in-out;
  406. -o-transition: all 0.5s ease-in-out;
  407. transition: all 0.6s ease-in-out;
  408. }
  409.  
  410. #profile:hover #avatar{
  411. left:160px;
  412. -webkit-transition: all 0.5s ease-in-out;
  413. -moz-transition: all 0.6s ease-in-out;
  414. -o-transition: all 0.5s ease-in-out;
  415. transition: all 0.6s ease-in-out;
  416. }
  417.  
  418. /* Blog title */
  419.  
  420. #blogtitle{
  421. margin-left:15px;
  422. margin-top:20px;
  423. width:150px;
  424. height:25px;
  425. font-size:{select:Blog title font size};
  426. font-family:{select:Title font};
  427. color:{color:Blog Title};
  428. text-align:right;
  429. border-bottom: 1px solid {color:Borders};
  430. {block:if700pxPosts}
  431. margin-top:50px;
  432. width:240px;
  433. {/block:if700pxPosts}
  434. }
  435.  
  436. #profile:hover #blogtitle{
  437. margin-left:-200px;
  438. width:420px;
  439. text-align:center;
  440. -webkit-transition: all 0.5s ease-in-out;
  441. -moz-transition: all 0.6s ease-in-out;
  442. -o-transition: all 0.5s ease-in-out;
  443. transition: all 0.6s ease-in-out;
  444. }
  445.  
  446. /* Profile links */
  447.  
  448. #prolinks{
  449. margin-top:25px;
  450. width:190px;
  451. margin-left:-15px;
  452. height:100px;
  453. width:60px;
  454. {block:if700pxPosts}
  455. width:200px;
  456. margin-left:70px;
  457. {/block:if700pxPosts}
  458. }
  459.  
  460. #click1, #click2, #click3{
  461. display:block;
  462. margin-top:12px;
  463. font-size:14px;
  464. color:{color:Profile link};
  465. cursor:pointer;
  466. width:180px;
  467. text-align:right;
  468. }
  469.  
  470. #click1:hover, #click2:hover, #click3:hover{
  471. color:{color:Hover};
  472. background:{color:Borders};
  473. }
  474.  
  475. #prolinks i{
  476. font-size:12px;
  477. padding:4px;
  478. width:12px;
  479. height:12px;
  480. color:{color:Profile icon};
  481. }
  482.  
  483. #click1:hover i, #click2:hover i, #click3:hover i{
  484. color:{color:Hover};
  485. }
  486.  
  487. #profile:hover #prolinks{
  488. margin-left:-120px;
  489. -webkit-transition: all 0.5s ease-in-out;
  490. -moz-transition: all 0.6s ease-in-out;
  491. -o-transition: all 0.5s ease-in-out;
  492. transition: all 0.6s ease-in-out;
  493. }
  494.  
  495. #profile:hover #click1, #profile:hover #click2, #profile:hover #click3{
  496. border:1px solid {color:Borders};
  497. width:110px;
  498. padding-right:5px;
  499. -webkit-transition: all 0.5s ease-in-out;
  500. -moz-transition: all 0.6s ease-in-out;
  501. -o-transition: all 0.5s ease-in-out;
  502. transition: all 0.6s ease-in-out;
  503. }
  504.  
  505. /* Pop up boxes */
  506.  
  507. #description, #navigation, #social{
  508. position:absolute;
  509. margin-top:0px;
  510. margin-left:0px;
  511. width: 500px;
  512. height:240px;
  513. font-size:12px;
  514. line-height:20px;
  515. text-align:center;
  516. background:{color:Popup box background};
  517. z-index:100;
  518. display:none;
  519. {block:if700pxPosts}
  520. width:700px;
  521. height:330px;
  522. font-size:14px;
  523. line-height:24px;
  524. {/block:if700pxPosts}
  525. }
  526.  
  527. /* Description, Navigation and Social box heading */
  528.  
  529. #header h1{
  530. height:25px;
  531. line-height:25px;
  532. padding:5px;
  533. font-size:20px;
  534. background:{color:Popup box background};
  535. }
  536.  
  537. .headerbox{
  538. position:absolute;
  539. top:50%;
  540. left:50%;
  541. width:300px;
  542. height:auto;
  543. -webkit-transform: translateX(-50%) translateY(-50%);
  544. -moz-transform: translateX(-50%) translateY(-50%);
  545. -ms-transform: translateX(-50%) translateY(-50%);
  546. transform: translateX(-50%) translateY(-50%);
  547. {block:If700pxPosts}
  548. width:400px;
  549. {/block:If700pxPosts}
  550. overflow:hidden;
  551. overflow-y:auto;
  552. }
  553.  
  554. #navigation a, #social a{
  555. display:inline-block;
  556. margin:10px;
  557. padding-left:4px;
  558. padding-right:4px;
  559. font-size:15px;
  560. border:1px solid {color:Borders};
  561. color:{color:Profile link};
  562. }
  563.  
  564. #navigation a:hover, #social a:hover{
  565. background:{color:Borders};
  566. color:{color:Hover};
  567. }
  568.  
  569. #social i{
  570. margin-left:-3px;
  571. font-size:12px;
  572. padding:3px;
  573. width:15px;
  574. height:15px;
  575. line-height:15px;
  576. text-align:center;
  577. color:{color:Profile icon};
  578. border-right:1px solid {color:Borders};
  579. }
  580.  
  581. #social i:hover{
  582. color:{color:Hover};
  583. }
  584.  
  585. /* Close icons */
  586.  
  587. #close1, #close2, #close3{
  588. position:absolute;
  589. margin-left:464px;
  590. margin-top:0px;
  591. cursor:pointer;
  592. {block:if700pxPosts}
  593. margin-left:664px;
  594. {/block:if700pxPosts}
  595. }
  596.  
  597. #close1 i, #close2 i, #close3 i{
  598. font-size:15px;
  599. padding:5px;
  600. width:25px;
  601. height:25px;
  602. line-height:25px;
  603. text-align:center;
  604. color:{color:Profile icon};
  605. border-left:1px solid {color:Borders};
  606. border-right:1px solid transparent;
  607. }
  608.  
  609. #close1 i:hover, #close2 i:hover, #close3 i:hover{
  610. color:{color:Hover};
  611. background:{color:Borders};
  612. }
  613.  
  614. /*------ MAIN CONTAINER -----*/
  615.  
  616. #container{
  617. position:absolute;
  618. top:100%;
  619. left:0;
  620. width:100%;
  621. height:auto;
  622. min-height:700px;
  623. }
  624.  
  625. /*------ POSTS -----*/
  626.  
  627. #posts {
  628. position:relative;
  629. width:500px;
  630. min-height:400px;
  631. margin-top:40px;
  632. margin-left:auto;
  633. margin-right:auto;
  634. z-index:10;
  635. {block:if700pxPosts}
  636. width:700px;
  637. {/block:if700pxPosts}
  638. }
  639.  
  640. .entry {
  641. float:left;
  642. display: block;
  643. margin-top:25px;
  644. margin-bottom:25px;
  645. margin-left:0px;
  646. width:500px;
  647. background:{color:Post background};
  648. border:1px solid {color:Borders};
  649. overflow:hidden;
  650. {block:if700pxPosts}
  651. width:700px;
  652. {/block:if700pxPosts}
  653. overflow:hidden;
  654. }
  655.  
  656. .entry img { max-width: 100%; }
  657.  
  658. .divider{
  659. margin-top:60px;
  660. margin-bottom:60px;
  661. margin-left:auto;
  662. margin-right:auto;
  663. width:200px;
  664. height:1px;
  665. background:{color:Borders};
  666. }
  667.  
  668. /* ----------------------- POST STYLES ----------------------------- */
  669.  
  670. /* Quote posts */
  671.  
  672. .quote {
  673. font-family:{select:Title font};
  674. font-size:{select:Title font size};
  675. line-height: -moz-calc({select:Title font size} + 3px);
  676. line-height: -webkit-calc({select:Title font size} + 3px);
  677. line-height: -o-calc({select:Title font size} + 3px);
  678. line-height: calc({select:Title font size} + 3px);
  679. color:{color:Italic};
  680. height:auto;
  681. margin:10px;
  682. padding:5px;
  683. text-align:center;
  684. letter-spacing:1px;
  685. }
  686.  
  687. .symbol{
  688. color:{color:Link};
  689. font-size:200%;
  690. max-width:30px;
  691. max-height:30px;
  692. line-height:75%;
  693. margin:auto;
  694. padding:5px;
  695. }
  696.  
  697. .source {
  698. font-family:{font:Body font};
  699. font-size:{select:Body font size};
  700. line-height:130%;
  701. height:auto;
  702. margin-top:10px;
  703. margin-left:10px;
  704. margin-right:10px;
  705. margin-bottom:5px;
  706. padding:5px;
  707. text-align:right;
  708. letter-spacing:1px;
  709. }
  710.  
  711. /* Link posts */
  712.  
  713. #linktitle{
  714. margin:10px;
  715. color:{color:Title};
  716. font-family:{select:Title font};
  717. font-size:{select:Title font size};
  718. background:{color:Borders};
  719. line-height: -moz-calc({select:Title font size} + 3px);
  720. line-height: -webkit-calc({select:Title font size} + 3px);
  721. line-height: -o-calc({select:Title font size} + 3px);
  722. line-height: calc({select:Title font size} + 3px);
  723. border:1px solid {color:Borders};
  724. text-transform:lowercase;
  725. padding:5px;
  726. width:470px;
  727. {block:If700pxPosts}
  728. width:670px;
  729. {/block:If700pxPosts}
  730. }
  731.  
  732. #linktitle a{
  733. color:{color:Link};
  734. }
  735.  
  736. #linktitle i{
  737. color:{color:Icon};
  738. }
  739.  
  740. #linktitle:hover{
  741. color:{color:Hover};
  742. box-shadow: inset 500px 0 0 0 {color:Borders};
  743. {block:If700pxPosts}
  744. box-shadow: inset 700px 0 0 0 {color:Borders};
  745. {/block:If700pxPosts}
  746. {block:PermalinkPage}
  747. box-shadow: inset 500px 0 0 0 {color:Borders};
  748. {/block:PermalinkPage}
  749. }
  750.  
  751. /* Audio posts */
  752.  
  753. .album img{
  754. max-width:65px;
  755. margin-left:15px;
  756. float:left;
  757. margin-top:15px;
  758. z-index:10;
  759. border: 3px solid {color:Borders};
  760. }
  761.  
  762. .audio{
  763. position:absolute;
  764. width:185px;
  765. min-height:100px;
  766. margin-left:95px;
  767. float:left;
  768. padding:5px;
  769. margin-top:15px;
  770. z-index:10;
  771. font-size:12px;
  772. overflow:hidden;
  773. }
  774.  
  775. .play{
  776. position:absolute;
  777. margin:30px;
  778. max-width:25px;
  779. max-height:25px;
  780. overflow:hidden;
  781. opacity:0.7;
  782. }
  783.  
  784. /* Ask posts */
  785.  
  786. .question{
  787. margin:10px;
  788. width:470px;
  789. height:24px;
  790. line-height:24px;
  791. margin-bottom:10px;
  792. border-bottom:1px solid {color:Borders};
  793. }
  794.  
  795. .question img{
  796. border:3px solid {color:Borders};
  797. margin-right:4px;
  798. }
  799.  
  800. .answer{
  801. margin:10px;
  802. margin-top:25px;
  803. width:470px;
  804. color:{color:Answer};
  805. {block:if700pxPosts}
  806. width:670px;
  807. {/block:if700pxPosts}
  808. padding:5px;
  809. background:{color:Borders};
  810. line-height:20px;
  811. }
  812.  
  813. /* Chat posts */
  814.  
  815. .chat ul {
  816. display:block;
  817. list-style:none;
  818. margin-left:-20px;
  819. }
  820.  
  821. /* Chat lines style */
  822. .chat li {
  823. padding:3px;
  824. display:block;
  825. }
  826.  
  827. /* Odd lines style */
  828. .chat .odd {
  829. color:{color:Chat 1};
  830. }
  831.  
  832. /* Even lines style */
  833. .chat .even {
  834. color:{color:Chat 2};
  835. }
  836.  
  837. /*-- POST INFO --*/
  838.  
  839. /* Top info */
  840.  
  841. .info1 {
  842. height:auto;
  843. float:center;
  844. margin-left:0px;
  845. font-size:10px;
  846. height:30px;
  847. line-height:30px;
  848. width:500px;
  849. border-bottom:1px solid {color:Borders};
  850. {block:if700pxPosts}
  851. width:700px;
  852. {/block:if700pxPosts}
  853. text-transform:uppercase;
  854. }
  855.  
  856. .postnumber{
  857. margin-top:0px;
  858. margin-left:2px;
  859. font-size:20px;
  860. width:30px;
  861. height:30px;
  862. text-align:center;
  863. color:{color:Icon};
  864. border-right:1px solid {color:Borders};
  865. }
  866.  
  867. .postnumber:hover{
  868. background:{color:Borders};
  869. }
  870.  
  871. .posttype{
  872. position:absolute;
  873. margin-top:-30px;
  874. margin-left:35px;
  875. height:20px;
  876. line-height:20px;
  877. font-size:10px;
  878. padding:5px;
  879. }
  880.  
  881. .postdate{
  882. position:absolute;
  883. margin-top:-30px;
  884. margin-left:385px;
  885. height:20px;
  886. width:100px;
  887. line-height:20px;
  888. font-size:10px;
  889. padding:5px;
  890. {block:if700pxPosts}
  891. margin-left:585px;
  892. {/block:if700pxPosts}
  893. text-align:right;
  894. }
  895.  
  896. .info1 a{
  897. color:{color:Text};
  898. }
  899.  
  900. /* Bottom info */
  901.  
  902. .info2 {
  903. height:auto;
  904. float:center;
  905. margin-left:0px;
  906. font-size:10px;
  907. min-height:20px;
  908. height:auto;
  909. line-height:20px;
  910. padding:5px 10px;
  911. width:500px;
  912. border-top:1px solid {color:Borders};
  913. {block:if700pxPosts}
  914. width:700px;
  915. {/block:if700pxPosts}
  916. text-transform:uppercase;
  917. }
  918.  
  919. .info2 a{
  920. font-size:10px;
  921. border-bottom:1px solid {color:Borders};
  922. }
  923.  
  924. .info1 a:hover, .info2 a:hover{
  925. color:{color:Hover};
  926. }
  927.  
  928. /*-- LIKE AND REBLOG BUTTONS --*/
  929.  
  930. .like_and_reblog_buttons {
  931. width:50px;
  932. margin-left:395px;
  933. margin-top:-22px;
  934. {block:if700pxPosts}
  935. margin-left:595px;
  936. {/block:if700pxPosts}
  937. z-index:100;
  938. list-style: none;
  939. }
  940.  
  941. .like_and_reblog_buttons li {
  942. float:right;
  943. margin: 5px 5px;
  944. height: 15px;
  945. list-style:none;
  946. text-decoration:none;
  947. }
  948.  
  949. .like_and_reblog_buttons a {
  950. border-bottom:1px solid transparent;
  951. }
  952.  
  953. /*-- PAGINATION --*/
  954.  
  955. #pagination{
  956. margin-top:0px;
  957. margin-bottom:20px;
  958. margin-left:auto;
  959. margin-right:auto;
  960. width:522px;
  961. height:40px;
  962. line-height:40px;
  963. text-align:center;
  964. z-index:10000;
  965. {block:ifInfiniteScrolling}
  966. display:none;
  967. {/block:ifInfiniteScrolling}
  968. }
  969.  
  970. #pagination a{
  971. padding:5px;
  972. color:{color:Pagination};
  973. }
  974.  
  975. #pagination a:hover{
  976. color:{color:Hover};
  977. }
  978.  
  979. #pagination i{
  980. color:{color:Pagination};
  981. }
  982.  
  983. /*-- INFINITE SCROLLING --*/
  984.  
  985. #infscr-loading{
  986. bottom: -70px;
  987. position: absolute;
  988. left: 50%;
  989. margin-left:-8px;
  990. width:16px;
  991. height:11px;
  992. overflow:hidden;
  993. }
  994.  
  995. /*-- THEME CREDIT --*/
  996.  
  997. #credit {
  998. position:fixed;
  999. right:5px;
  1000. top:7px;
  1001. width:30px;
  1002. z-index:10000;
  1003. }
  1004.  
  1005. /* END CSS */
  1006.  
  1007. {CustomCSS}
  1008.  
  1009. </style>
  1010.  
  1011. <script type="text/javascript"
  1012. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  1013.  
  1014. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  1015.  
  1016. <script>
  1017. $(document).ready(function(){
  1018. $("#click1").click(function(){
  1019. $("#description").slideToggle(10);
  1020. });
  1021. });
  1022. </script>
  1023.  
  1024. <script>
  1025. $(document).ready(function(){
  1026. $("#close1").click(function(){
  1027. $("#description").slideToggle(10);
  1028. });
  1029. });
  1030. </script>
  1031.  
  1032. <script>
  1033. $(document).ready(function(){
  1034. $("#click2").click(function(){
  1035. $("#navigation").slideToggle(10);
  1036. });
  1037. });
  1038. </script>
  1039.  
  1040. <script>
  1041. $(document).ready(function(){
  1042. $("#close2").click(function(){
  1043. $("#navigation").slideToggle(1);
  1044. });
  1045. });
  1046. </script>
  1047.  
  1048. <script>
  1049. $(document).ready(function(){
  1050. $("#click3").click(function(){
  1051. $("#social").slideToggle(1);
  1052. });
  1053. });
  1054. </script>
  1055.  
  1056. <script>
  1057. $(document).ready(function(){
  1058. $("#close3").click(function(){
  1059. $("#social").slideToggle(1);
  1060. });
  1061. });
  1062. </script>
  1063.  
  1064. <!-- Fort awesome script -->
  1065.  
  1066. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  1067.  
  1068. <!-- Style my tooltips script -->
  1069.  
  1070. <script src="jquery.style-my-tooltips.js"></script>
  1071.  
  1072. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
  1073.  
  1074. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  1075. <script>
  1076. (function($){
  1077. $(document).ready(function(){
  1078. $("[title]").style_my_tooltips({
  1079. tip_follows_cursor:true,
  1080. tip_delay_time:200,
  1081. tip_fade_speed:300
  1082. }
  1083. );
  1084. });
  1085. })(jQuery);
  1086. </script>
  1087.  
  1088. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  1089.  
  1090. {block:IndexPage}
  1091. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  1092.  
  1093. {block:ifInfiniteScrolling}
  1094. <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/EIBmz7s0p/infinitescrolling.js"></script>
  1095. {/block:ifInfiniteScrolling}
  1096.  
  1097. <script type="text/javascript">
  1098. $(window).load(function(){
  1099. var $wall = $('#posts');
  1100. $wall.imagesLoaded(function(){
  1101. $wall.masonry({
  1102. itemSelector: '.entry',
  1103. isAnimated : false
  1104. });
  1105. });
  1106.  
  1107. $wall.infinitescroll({
  1108. navSelector : '#pagination',
  1109. nextSelector : '#pagination a',
  1110. itemSelector : '.entry',
  1111. bufferPx : 2000,
  1112. debug : false,
  1113. errorCallback: function() {
  1114. $('#infscr-loading').fadeOut('normal');
  1115. }},
  1116. function( newElements ) {
  1117. var $newElems = $( newElements );
  1118. $newElems.hide();
  1119. $newElems.imagesLoaded(function(){
  1120. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1121. });
  1122. }); $('#posts').show(500);
  1123. });
  1124. </script>
  1125. {/block:IndexPage}
  1126.  
  1127.  
  1128. </head>
  1129.  
  1130. <meta charset="utf-8">
  1131. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  1132. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  1133. <link rel="shortcut icon" href="{Favicon}">
  1134. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  1135. <meta name="viewport" content="width=device-width, initial-scale=1">
  1136.  
  1137. <!-- HTML -->
  1138.  
  1139. <body>
  1140.  
  1141. <div id="header">
  1142.  
  1143. <div id="profile">
  1144.  
  1145. {block:IfShowavatar}
  1146. <div id="avatar"><img src="{image:Avatar}"></div>
  1147. {/block:IfShowavatar}
  1148.  
  1149. <div id="blogtitle">{Title}</div>
  1150.  
  1151. <div id="prolinks">
  1152.  
  1153. <div id="click1"><i class="fa fa-user" aria-hidden="true"></i>....... About</div>
  1154.  
  1155. <div id="click2"><i class="fa fa-list" aria-hidden="true"></i> ......... Links</div>
  1156.  
  1157. <div id="click3"><i class="fa fa-tumblr" aria-hidden="true"></i> ........... Social </div>
  1158.  
  1159. </div>
  1160. <!--End prolinks-->
  1161.  
  1162. </div>
  1163. <!--End profile-->
  1164.  
  1165. <div id="description">
  1166.  
  1167. <div id="close1"><i class="fa fa-times" aria-hidden="true"></i></div>
  1168.  
  1169. <h1> About </h1>
  1170.  
  1171. <div class="headerbox">
  1172. {Description}
  1173. </div>
  1174. <!--End headerbox-->
  1175.  
  1176. </div>
  1177. <!--End description-->
  1178.  
  1179. <div id="navigation">
  1180.  
  1181. <div id="close2"><i class="fa fa-times" aria-hidden="true"></i></div>
  1182.  
  1183. <h1> Links </h1>
  1184.  
  1185. <div class="headerbox">
  1186. {block:IfShowLinkOne}
  1187. <a href="{text:Link One Url}">{text:Link One Title}</a>
  1188. {/block:IfShowLinkOne}
  1189. {block:IfShowLinkTwo}
  1190. <a href="{text:Link Two Url}">{text:Link Two Title}</a>
  1191. {/block:IfShowLinkTwo}
  1192. {block:IfShowLinkThree}
  1193. <a href="{text:Link Three Url}">{text:Link Three Title}</a>
  1194. {/block:IfShowLinkThree}
  1195. {block:IfShowLinkFour}
  1196. <a href="{text:Link Four Url}">{text:Link Four Title}</a>
  1197. {/block:IfShowLinkFour}
  1198. {block:IfShowLinkFive}
  1199. <a href="{text:Link Five Url}">{text:Link Five Title}</a>
  1200. {/block:IfShowLinkFive}
  1201. </div>
  1202. <!--End headerbox-->
  1203.  
  1204. </div>
  1205. <!--End navigation-->
  1206.  
  1207. <div id="social">
  1208.  
  1209. <div id="close3"><i class="fa fa-times" aria-hidden="true"></i></div>
  1210.  
  1211. <h1> Social links </h1>
  1212.  
  1213. <div class="headerbox">
  1214. {block:IfShowFacebook}<a href="{text:Facebook url}" target = "_blank"><i class="fa fa-facebook"></i> Facebook </a>{/block:IfShowFacebook}
  1215. {block:IfShowTwitter}<a href="{text:Twitter url}"><i class="fa fa-twitter"></i> Twitter</a>{/block:IfShowTwitter}
  1216. {block:IfShowFlickr}<a href="{text:Flickr url}"><i class="fa fa-flickr"></i> Flickr </a>{/block:IfShowFlickr}
  1217. {block:IfShowGoogleplus}<a href="{text:Googleplus url}"><i class="fa fa-google-plus"></i> Google Plus </a>{/block:IfShowGoogleplus}
  1218. {block:IfShowDeviantart}<a href="{text:Deviantart url}"><i class="fa fa-deviantart"></i> DeviantArt </a>{/block:IfShowDeviantart}
  1219. </div>
  1220. <!--End headerbox-->
  1221.  
  1222. </div>
  1223. <!--End social-->
  1224.  
  1225. <div id="menu">
  1226. <a href="/" title="Index"></a>
  1227. <a href="/ask" title="Ask"></a>
  1228. <a href="/submit" title="Submit"></a>
  1229. <a href="/archive" title="Archive"></a>
  1230. </div>
  1231. <!--End menu-->
  1232.  
  1233. </div>
  1234. <!--End header-->
  1235.  
  1236. <!-- POSTS -->
  1237.  
  1238. <div id="container">
  1239.  
  1240. <div id="posts">
  1241.  
  1242. {block:Posts}
  1243.  
  1244. <div class="entry">
  1245.  
  1246. {block:Date}
  1247. <div class="info1">
  1248.  
  1249. <div class="postnumber">
  1250. {PostNumberWithZero}
  1251. </div>
  1252. <!--End postnumber-->
  1253.  
  1254. <div class="posttype">
  1255. <a href="{Permalink}">{PostType}</a>
  1256. </div>
  1257. <!--End posttype-->
  1258.  
  1259. <div class="postdate">
  1260. <a href="{Permalink}">{Shortmonth} {DayOfMonthWithZero}</a>
  1261. </div>
  1262. <!--End postdate-->
  1263.  
  1264. </div>
  1265. <!--End info1-->
  1266. {/block:Date}
  1267.  
  1268. <!-- Text -->
  1269. {block:Text}
  1270. {block:Title}
  1271. <a href="{Permalink}">
  1272. <h1>{Title}</h1></a>
  1273. {/block:Title}
  1274. <h2>{Body}</h2>
  1275. {/block:Text}
  1276.  
  1277. <!-- Photo -->
  1278. {block:Photo}
  1279. {block:ifNot700pxPosts}
  1280. <a href="{Permalink}">
  1281. <img src="{PhotoURL-500}"
  1282. width="500"/></a>
  1283. {/block:ifNot700pxPosts}
  1284. {block:if700pxPosts}
  1285. <a href="{Permalink}">
  1286. <img src="{PhotoURL-500}"
  1287. width="700"/></a>
  1288. {/block:if700pxPosts}
  1289. {/block:Photo}
  1290.  
  1291. <!-- Photoset -->
  1292. {block:Photoset}
  1293. {block:ifNot700pxPosts}
  1294. {Photoset-500}
  1295. {/block:ifNot700pxPosts}
  1296. {block:if700pxPosts}
  1297. {Photoset-700}
  1298. {/block:if700pxPosts}
  1299. {/block:Photoset}
  1300.  
  1301. <!-- Quote -->
  1302. {block:Quote}
  1303. <div class="quote">
  1304. <div class="symbol">"</div>
  1305. {Quote}
  1306. {block:Source}
  1307. <div class="source">-{Source}
  1308. </div>{/block:Source}</div>
  1309. {/block:Quote}
  1310.  
  1311. <!-- Link -->
  1312. {block:Link}
  1313. <div id="linktitle">
  1314. <a href="{URL}"
  1315. class="linkpost"
  1316. target="_blank">
  1317. {Name} &raquo; </a>
  1318. </div>
  1319. {block:Description}
  1320. <h2>{Description}</h2>
  1321. {/block:Description}
  1322. {/block:Link}
  1323.  
  1324. <!-- Chat -->
  1325. {block:Chat}
  1326. <div class="chat">
  1327. <ul>
  1328. {block:Lines}
  1329. <li class="{Alt}">
  1330. {block:Label}<b>{Label}</b>{/block:Label}
  1331. {Line}
  1332. </li>
  1333. {/block:Lines}
  1334. </ul>
  1335. </div>
  1336. {/block:Chat}
  1337.  
  1338. <!-- Audio -->
  1339. {block:Audio}
  1340. <div class="album">{block:AlbumArt}<img src="{AlbumArtURL}">
  1341. {block:AlbumArt}
  1342. <div class="play">
  1343. {AudioPlayerWhite}
  1344. </div>
  1345. </div>
  1346. <div class="audio">
  1347. {block:TrackName}<b>Title:</b> {TrackName}{/block:TrackName}
  1348. {block:Artist}<br><b>Artist:</b> {Artist}{/block:Artist}
  1349. {block:Album}<br><b>Album:</b> {Album}{/block:Album}
  1350. {block:PlayCount}<br><b>Play count:</b> {PlayCount}{/block:PlayCount}<br></div>
  1351. <br><br><br><br><br>
  1352. {/block:Audio}
  1353.  
  1354. <!-- Video -->
  1355. {block:Video}
  1356. {block:ifNot700pxPosts}
  1357. {Video-500}
  1358. {/block:ifNot700pxPosts}
  1359. {block:if700pxPosts}
  1360. {Video-700}
  1361. {/block:if700pxPosts}
  1362. {/block:Video}
  1363.  
  1364. <!-- Ask -->
  1365. {block:Answer}
  1366. <div class="question">
  1367. <img src="{AskerPortraitURL-48}"
  1368. align="left">
  1369. {Asker}</div>
  1370. {Question}&nbsp;
  1371. <div class="answer">
  1372. {Answer}</div>
  1373. {/block:Answer}
  1374.  
  1375. <!-- Caption -->
  1376. {block:IndexPage}
  1377. {block:IfShowCaptions}
  1378. {block:Caption}
  1379. <h2>{Caption}</h2>
  1380. {/block:Caption}
  1381. {/block:IfShowCaptions}
  1382. {/block:IndexPage}
  1383. {block:PermalinkPage}
  1384. {block:Caption}
  1385. <h2>{Caption}</h2>
  1386. {/block:Caption}
  1387. {/block:PermalinkPage}
  1388.  
  1389. {block:Date}
  1390. <div class="info2">
  1391.  
  1392. {block:RebloggedFrom}
  1393. VIA <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1394. {/block:RebloggedFrom}
  1395.  
  1396. {block:NotReblog}
  1397. BY <a href="/">{text:Blog alias}</a>
  1398. {/block:NotReblog}
  1399.  
  1400. / NOTES: {block:NoteCount}
  1401. <a href="{Permalink}">
  1402. {NoteCount}</a>
  1403. {/block:NoteCount}
  1404.  
  1405. <!-- Like and reblog buttons -->
  1406. <ul class="like_and_reblog_buttons">
  1407. <li>{LikeButton size="15"}</li>
  1408. <li>{ReblogButton size="15"}</li>
  1409. </ul>
  1410.  
  1411. </div>
  1412. <!--End info2-->
  1413. {/block:Date}
  1414.  
  1415. <!-- Tags -->
  1416. {block:IndexPage}
  1417. {block:IfShowTags}
  1418. {block:HasTags}
  1419. <div class="info2">
  1420. {block:Tags}
  1421. #<a href="{TagURL}">{Tag}</a>,&nbsp;
  1422. {/block:Tags}
  1423. </div>
  1424. {/block:HasTags}
  1425. {/block:IfShowTags}
  1426. {/block:IndexPage}
  1427. {block:PermalinkPage}
  1428. {block:HasTags}
  1429. <div class="info2">
  1430. {block:Tags}
  1431. #<a href="{TagURL}">{Tag}</a>,&nbsp;
  1432. {/block:Tags}
  1433. </div>
  1434. {/block:HasTags}
  1435. {/block:PermalinkPage}
  1436.  
  1437. <!-- Permalink page -->
  1438. {block:PermalinkPage}
  1439. <!-- Post notes-->
  1440. {block:PostNotes}
  1441. <div class="postnotes">
  1442. <h1>Post notes:</h1>
  1443. {PostNotes}
  1444. </div>
  1445. {/block:PostNotes}
  1446. {/block:PermalinkPage}
  1447.  
  1448. <!-- No via and source in captions-->
  1449.  
  1450. <!-- {block:NoRebloggedFrom}
  1451. {block:RebloggedFrom}
  1452. {ReblogParentName}
  1453. {/block:RebloggedFrom}
  1454. {/block:NoRebloggedFrom} -->
  1455. {block:ContentSource}
  1456. <!-- {SourceURL}
  1457. {block:SourceLogo}
  1458. <img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1459. {/block:SourceLogo}
  1460. {block:NoSourceLogo}
  1461. {SourceLink}
  1462. {/block:NoSourceLogo} -->
  1463. {/block:ContentSource}
  1464.  
  1465. </div>
  1466. <!--End entry-->
  1467.  
  1468. {/block:Posts}
  1469.  
  1470. </div>
  1471. <!-- End posts -->
  1472.  
  1473. {block:Pagination}
  1474. <div id="pagination">
  1475. {block:PreviousPage}
  1476. <span class="pagicon">
  1477. <a href="{PreviousPage}" title="NEWER"><i class="fa fa-long-arrow-left"></i> NEWER </a>
  1478. </span> /
  1479. {/block:PreviousPage}
  1480.  
  1481. <span class="pagicon">
  1482. <a href="#" title="back to top"><i class="fa fa-long-arrow-up"></i> TOP </a>
  1483. </span> /
  1484.  
  1485. {block:NextPage}
  1486. <span class="next">
  1487. <a href="{NextPage}" title="OLDER"> OLDER <i class="fa fa-long-arrow-right"></i></a>
  1488. </span>
  1489. {/block:NextPage}
  1490. </div>
  1491. {/block:Pagination}
  1492. <!--End pagination-->
  1493.  
  1494. </div>
  1495. <!--End container-->
  1496.  
  1497. </div>
  1498.  
  1499. <!-- CREDIT (DO NOT REMOVE) -->
  1500. <div id="credit"><a href="http://www.hunterthemes.tumblr.com">
  1501. <img src="http://i60.tinypic.com/b5qp0o.png" title="theme by hunter themes"></div></a>
  1502.  
  1503. </body>
  1504. </html>
  1505.  
  1506. <!-- END HTML -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement