Advertisement
Guest User

Untitled

a guest
Aug 3rd, 2015
168
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.63 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4. theme: breezeblocks 2.0
  5. - sorrism -
  6.  
  7.  
  8. -->
  9.  
  10. <!DOCTYPE html><head>
  11.  
  12. <title>{block:TagPage}#{Tag} : {/block:TagPage} {block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  13.  
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}
  17. <meta name="description" content="{MetaDescription}" />{/block:Description}
  18.  
  19. <!--Default Variables-->
  20.  
  21. <meta name="color:Background" content="#ffffff"/>
  22. <meta name="color:Text" content="#aaaaaa"/>
  23. <meta name="color:Link" content="#777777"/>
  24. <meta name="color:Link Hover" content="#eeeeee"/>
  25. <meta name="color:Blog Title" content="#bbbbbb"/>
  26. <meta name="color:Title" content="#000000"/>
  27. <meta name="color:Scrollbar" content="#aaaaaa" />
  28. <meta name="color:Borders" content="#eeeeee"/>
  29. <meta name="color:Posts" content="#ffffff"/>
  30. <meta name="color:Accents" content="#fbfbfb"/>
  31. <meta name="color:Sidebar" content="#ffffff"/>
  32. <meta name="color:Sidebar Text" content="#aaaaaa"/>
  33. <meta name="color:Search Bar" content="#ffffff"/>
  34.  
  35. <meta name="image:Sidebar" content=""/>
  36. <meta name="image:Background" content=""/>
  37.  
  38. <meta name="if:Hide Captions" content="0"/>
  39. <meta name="if:Hide Tags" content="0"/>
  40. <meta name="if:Search Bar" content="0"/>
  41. <meta name="if:Infinite Scroll" content="0"/>
  42. <meta name="if:Small Sidebar Image" content="1"/>
  43. <meta name="if:Stretch Background" content="1"/>
  44.  
  45. <meta name="text:Home Title" content="Index"/>
  46. <meta name="text:Ask Title" content="Message"/>
  47. <meta name="text:Archive Title" content="Archive"/>
  48.  
  49. <meta name="text:Link 1 URL" content=""/>
  50. <meta name="text:Link 1" content=""/>
  51. <meta name="text:Link 2 URL" content=""/>
  52. <meta name="text:Link 2" content=""/>
  53. <meta name="text:Link 3 URL" content=""/>
  54. <meta name="text:Link 3" content=""/>
  55.  
  56. <meta name="text:Post Spacing" content="80"/>
  57.  
  58. <meta name="select:Sidebar Position" content="left" title="Left"/>
  59. <meta name="select:Sidebar Position" content="right" title="Right"/>
  60.  
  61. <meta name="select:Post Width" content="200" title="200px"/>
  62. <meta name="select:Post Width" content="250" title="250px"/>
  63. <meta name="select:Post Width" content="300" title="300px"/>
  64. <meta name="select:Post Width" content="350" title="350px"/>
  65. <meta name="select:Post Width" content="400" title="400px"/>
  66. <meta name="select:Post Width" content="450" title="450px"/>
  67. <meta name="select:Post Width" content="500" title="500px"/>
  68. <meta name="select:Post Width" content="540" title="540px"/>
  69.  
  70. <!--css-->
  71.  
  72. <link rel="stylesheet" href="http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css">
  73.  
  74. <style type="text/css">
  75.  
  76. /*tumblr controls and lightbox*/
  77.  
  78. iframe#tumblr_controls {
  79. white-space:nowrap!important;
  80. top:5px!important;
  81. right:5px!important;
  82. opacity:.4!important;
  83. -webkit-filter:invert(70%)!important;
  84. -moz-filter:invert(70%)!important;
  85. -ms-filter:invert(70%)!important;
  86. -o-filter:invert(70%)!important;
  87. filter:invert(70%)!important;
  88. position:fixed!important;
  89. }
  90.  
  91. #tumblr_lightbox {
  92. background-color:rgba({RGBcolor:background}, .9)!important;
  93. z-index:99999!important;
  94. }
  95.  
  96. #tumblr_lightbox img {
  97. opacity:0;
  98. border:3px solid {color:posts}!important;
  99. margin-top:-3px!important;
  100. margin-left:-3px!important;
  101. }
  102.  
  103. #tumblr_lightbox_caption {
  104. color:black!important;
  105. font-family:arial!important;
  106. font-size:10px!important;
  107. font-weight:normal!important;
  108. text-shadow:none!important;
  109. }
  110.  
  111. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {
  112. -moz-box-shadow:none!important;
  113. -webkit-box-shadow:none!important;
  114. box-shadow:none!important;
  115. -moz-border-radius:3px!important;
  116. -webkit-border-radius:3px!important;
  117. border-radius:3px!important;
  118. opacity:1!important;
  119. }
  120.  
  121. #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {opacity:.6!important;}
  122.  
  123. /*tooltip*/
  124.  
  125. .ui-tooltip {
  126. position:Absolute;
  127. z-index:9999;
  128. padding-top:10px;
  129. }
  130.  
  131. .ui-tooltip-content {
  132. background:{color:posts};
  133. padding:2px 5px;
  134. font-size:7px;
  135. text-transform:uppercase;
  136. letter-spacing:1px;
  137. border:1px solid {color:borders};
  138. font-family:trebuchet ms;
  139. border-radius:3px;
  140. -moz-border-radius:3px;
  141. -webkit-border-radius:3px;
  142. }
  143.  
  144. /*scrollbar*/
  145.  
  146. ::-webkit-scrollbar {
  147. height:2px;
  148. width:4px;
  149. background:inherit;
  150. }
  151.  
  152. ::-webkit-scrollbar-thumb{
  153. border-radius:3px;
  154. -moz-border-radius:3px;
  155. -webkit-border-radius:3px;
  156. background:{color:scrollbar};
  157. }
  158.  
  159. /*general*/
  160.  
  161. body {
  162. background:{color:background} url('{image:background}') center center fixed repeat;
  163. {block:ifstretchbackground}
  164. -webkit-background-size: cover;
  165. -moz-background-size: cover;
  166. -o-background-size: cover;
  167. background-size: cover;
  168. {/block:ifstretchbackground}
  169. color:{color:text};
  170. font-family:arial;
  171. font-size:9px;
  172. text-align:left;
  173. word-wrap:break-word;
  174. position:relative;
  175. margin:0;
  176. line-height:1.5em;
  177. }
  178.  
  179. img {
  180. opacity:1;
  181. border:0!Important;
  182. text-decoration:none;
  183. }
  184.  
  185. h1, h2, h3, h4 {
  186. font-weight:normal;
  187. color:{color:title};
  188. }
  189.  
  190. b, strong, b a, strong a {color:{color:title}!important;}
  191.  
  192. p {margin:5px 0;}
  193.  
  194. p:first-of-type {margin-top:0;}
  195.  
  196. p:last-of-type {margin-bottom:0;}
  197.  
  198. ul, ol {
  199. list-style:none;
  200. margin:.5em 0;
  201. padding:0;
  202. }
  203.  
  204. li {
  205. font-size:7px;
  206. letter-spacing:1px;
  207. text-transform:uppercase;
  208. padding-left:25px;
  209. position:relative;
  210. }
  211.  
  212. li:before, li:before {
  213. content:'';
  214. height:1px;
  215. background:{color:borders};
  216. position:absolute;
  217. width:15px;
  218. top:6px;
  219. margin-left:-25px;
  220. }
  221.  
  222. .chat li:before, .same li:before {display:none!important;}
  223.  
  224. small, big, sub {font-size:1em;}
  225.  
  226. a {
  227. color:{color:link};
  228. cursor:help;
  229. text-decoration:none;
  230. transition:all .4s ease-in-out;
  231. -webkit-transition:all .4s ease-in-out;
  232. -o-transition:all .4s ease-in-out;
  233. -moz-transition:all .4s ease-in-out;
  234. }
  235.  
  236. a:hover {
  237. color:{color:link hover};
  238. text-decoration:none;
  239. }
  240.  
  241. .ped a, nav a, .caption a {position:relative;}
  242.  
  243. .ped a:before, .nav a:before, .caption a:before {
  244. position:absolute;
  245. left:0;
  246. width:0;
  247. background:{color:link hover};
  248. height:1px;
  249. content:'';
  250. top:100%;
  251. transition:all .4s ease-in-out;
  252. -webkit-transition:all .4s ease-in-out;
  253. -o-transition:all .4s ease-in-out;
  254. -moz-transition:all .4s ease-in-out;
  255. }
  256.  
  257. .ped a:hover::before, nav a:hover::before, .caption a:hover::before {width:100%;}
  258.  
  259. blockquote {
  260. margin:5px 0;
  261. padding:3px 0 3px 15px;
  262. border-left:1px solid {color:borders}!important;
  263. }
  264.  
  265. pre {
  266. width:{select:post width}px!important;
  267. overflow-x:scroll;
  268. word-break:break-all;
  269. font-family:verdana, arial;
  270. font-size:1em;
  271. background:transparent;
  272. white-space:pre-wrap;
  273. white-space:-moz-pre-wrap;
  274. white-space:-pre-wrap;
  275. white-space:-o-pre-wrap;
  276. word-wrap:break-word;
  277. }
  278.  
  279. .c {
  280. text-transform:uppercase;
  281. font-size:7px;
  282. font-family:trebuchet ms;
  283. letter-spacing:1px;
  284. }
  285.  
  286. /*aside*/
  287.  
  288. aside {
  289. width:150px;
  290. background:{color:sidebar};
  291. padding:9px;
  292. border:1px solid {color:borders};
  293. top:100px;
  294. left:50%;
  295. color:{color:sidebar text};
  296. -webkit-animation-name: fade-in;
  297. -webkit-animation-duration: 1.5s;
  298. border-radius:3px;
  299. -moz-border-radius:3px;
  300. -webkit-border-radius:3px;
  301. }
  302.  
  303. aside.right {
  304. margin-left:calc({select:post width}px / 2 + 60px);
  305. {block:ifsmallsidebarimage}
  306. margin-left:calc({select:post width}px / 2 + 120px);
  307. {/block:ifsmallsidebarimage}
  308. }
  309.  
  310. aside a {color:{color:sidebar text};}
  311.  
  312. aside.left {margin-left:calc(-{select:post width}px / 2 - 230px);}
  313.  
  314. #te {
  315. display:block;
  316. font-style:italic;
  317. color:{color:blog title};
  318. font-weight:bold;
  319. position:relative;
  320. font-size:12px;
  321. margin-top:5px;
  322. }
  323.  
  324. #d {
  325. padding-top:10px;
  326. border-top:1px solid {color:borders};
  327. margin:10px 0;
  328. }
  329.  
  330. nav {margin-top:5px;}
  331.  
  332. nav span {
  333. font-weight:bold;
  334. font-family:arial;
  335. display:inline-block;
  336. height:14px;
  337. width:14px;
  338. line-height:14px;
  339. text-align:center;
  340. background:{color:accents};
  341. margin-right:10px;
  342. -moz-border-radius:3px;
  343. -webkit-border-radius:3px;
  344. border-radius:3px;
  345. }
  346.  
  347. nav a {
  348. display:block;
  349. color:{color:blog title};
  350. padding:5px 0;
  351. border-top:1px solid {color:borders};
  352. }
  353.  
  354. nav a:last-of-type {padding-bottom:0;}
  355.  
  356. aside img {
  357. display:block;
  358. background:{color:posts};
  359. width:168px;
  360. -moz-border-top-left-radius:3px;
  361. -webkit-border-top-left-radius:3px;
  362. border-top-left-radius:3px;
  363. -moz-border-top-right-radius:3px;
  364. -webkit-border-top-right-radius:3px;
  365. border-top-right-radius:3px;
  366. {block:ifsmallsidebarimage}
  367. width:50px;
  368. height:50px;
  369. -moz-border-radius:3px;
  370. -webkit-border-radius:3px;
  371. border-radius:3px;
  372. {/block:ifsmallsidebarimage}
  373. }
  374.  
  375. .eek {
  376. display:inline-block;
  377. margin:-9px -9px 5px -9px;
  378. {block:ifsmallsidebarimage}
  379. position:absolute;
  380. left:-60px;
  381. top:0px;
  382. margin:0 auto;
  383. {/block:ifsmallsidebarimage}
  384. }
  385.  
  386. /*pagination*/
  387.  
  388. #pagination {
  389. {block:ifinfinitescroll}
  390. display:none;
  391. {/block:ifinfinitescroll}
  392. }
  393.  
  394. #pagination {
  395. text-align:center;
  396. margin:0 auto 100px auto;
  397. -webkit-animation-name: fade-in;
  398. -webkit-animation-duration: 1.5s;
  399. }
  400.  
  401. #pagination a {
  402. display:inline-block;
  403. margin:0 5px;
  404. color:{color:text};
  405. }
  406.  
  407. #infscr-loading {display:none!important;}
  408.  
  409. .nice {
  410. position:fixed;
  411. right:15px;
  412. bottom:10px;
  413. width:15px;
  414. height:15px;
  415. z-index:6;
  416. font-size:8px;
  417. line-height:15px;
  418. text-align:center;
  419. background:{color:posts};
  420. }
  421.  
  422. /*posts*/
  423.  
  424. #entries {
  425. position:relative;
  426. width:calc({select:post width}px + 20px);
  427. margin:100px auto {text:post spacing}px auto;
  428. {block:permalinkpage}
  429. margin-bottom:100px;
  430. {/block:permalinkpage}
  431. }
  432.  
  433. .posts {
  434. -webkit-animation-name: fade-in;
  435. -webkit-animation-duration: 1.5s;
  436. width:{select:post width}px;
  437. -moz-border-radius:3px;
  438. -webkit-border-radius:3px;
  439. border-radius:3px;
  440. position:relative;
  441. padding:3px;
  442. border:1px solid {color:borders};
  443. background:{color:posts};
  444. margin-bottom:{text:post spacing}px;
  445. display:inline-block;
  446. }
  447.  
  448. .posts li, .posts blockquote, .posts img {max-width:100%;}
  449.  
  450. .posts blockquote img {max-width:100%;}
  451.  
  452. .photo img, .posts iframe {
  453. display:block;
  454. margin:0;
  455. width:{select:post width}px;
  456. }
  457.  
  458. .photo img {
  459. -moz-border-radius:3px;
  460. -webkit-border-radius:3px;
  461. border-radius:3px;
  462. }
  463.  
  464. .ped img {
  465. max-width:calc({select:post width}px - 30px);
  466. height:auto;
  467. }
  468.  
  469. .ped iframe {max-width:calc({select:post width}px - 30px);}
  470.  
  471. .set {
  472. -moz-border-radius:3px;
  473. -webkit-border-radius:3px;
  474. border-radius:3px;
  475. overflow:hidden;
  476. }
  477.  
  478. .ped {padding:15px;}
  479.  
  480. #youtube_iframe {
  481. display:block;
  482. max-height:calc({select:post width}px * 0.67);
  483. max-width:{select:post width}px;
  484. }
  485.  
  486. .vi iframe, .tumblr_video_container {
  487. display:block;
  488. max-height:{select:post width}px;
  489. max-width:{select:post width}px;
  490. }
  491.  
  492. .instagram-media {max-height:none!important;}
  493.  
  494. a.tumblr_blog {
  495. display:inline-block;
  496. margin-bottom:3px;
  497. color:{color:text};
  498. }
  499.  
  500. a.tumblr_blog:hover {color:{color:link hover};}
  501.  
  502. /*titles*/
  503.  
  504. #title {
  505. color:{color:title};
  506. font-size:10px;
  507. font-weight:bold;
  508. padding:15px;
  509. }
  510.  
  511. #title a {
  512. color:{color:title};
  513. font-style:italic;
  514. }
  515.  
  516. .ed {border-top:1px solid {color:borders};}
  517.  
  518. /*captions*/
  519.  
  520. .caption {
  521. padding:15px;
  522. margin-top:3px;
  523. border-top:1px solid {color:borders};
  524. {block:indexpage}
  525. {block:ifhidecaptions}
  526. display:none;
  527. {/block:ifhidecaptions}
  528. {/block:indexpage}
  529. }
  530.  
  531. /*quotes*/
  532.  
  533. #titlequote{
  534. font-size:10px;
  535. font-weight:bold;
  536. padding:15px;
  537. font-style:italic;
  538. }
  539.  
  540. #source {
  541. line-height:30px;
  542. height:30px;
  543. padding-bottom:3px;
  544. position:Relative;
  545. overflow-y:hidden;
  546. display:block;
  547. overflow-x:auto;
  548. border-bottom:1px solid {color:borders};
  549. }
  550.  
  551. #source .fa {
  552. background:{color:accents};
  553. font-weight:bold;
  554. float:left;
  555. width:30px;
  556. line-height:30px;
  557. text-align:center;
  558. display:inline-block;
  559. -moz-border-radius:3px;
  560. -webkit-border-radius:3px;
  561. border-radius:3px;
  562.  
  563. }
  564.  
  565. #source .qe {
  566. padding:0 10px;
  567. line-height:30px;
  568. height:30px;
  569. display:block;
  570. margin-left:33px;
  571. background:{color:accents};
  572. -moz-border-radius:3px;
  573. -webkit-border-radius:3px;
  574. border-radius:3px;
  575. }
  576.  
  577. #source a {color:{color:text};}
  578.  
  579. #source a:hover {color:{color:link hover};}
  580.  
  581. /*asks*/
  582.  
  583. .q {
  584. padding:10px;
  585. background:{color:accents};
  586. margin-left:38px;
  587. -moz-border-radius:3px;
  588. -webkit-border-radius:3px;
  589. border-radius:3px;
  590. }
  591.  
  592. .as {
  593. float:left;
  594. position:relative;
  595. background:{color:accents};
  596. height:35px;
  597. width:35px;
  598. text-align:center;
  599. line-height:35px;
  600. font-size:10px;
  601. font-weight:bold;
  602. -moz-border-radius:3px;
  603. -webkit-border-radius:3px;
  604. border-radius:3px;
  605. }
  606.  
  607. .as i {line-height:35px;}
  608.  
  609. .as img {
  610. display:block;
  611. position:absolute;
  612. top:0;
  613. left:0;
  614. height:35px;
  615. width:35px;
  616. -moz-border-radius:3px;
  617. -webkit-border-radius:3px;
  618. border-radius:3px;
  619. }
  620.  
  621. .cl {
  622. margin-top:3px;
  623. float:right;
  624. }
  625.  
  626. .reb {margin:3px 38px 3px 0;}
  627.  
  628. .reb img {max-width:100%;}
  629.  
  630. /*chat*/
  631.  
  632. .chat {
  633. padding:0;
  634. margin:0;
  635. list-style:none;
  636. }
  637.  
  638. .line.odd {background:{color:accents};}
  639.  
  640. .line {
  641. padding:10px;
  642. letter-spacing:0;
  643. position:relative;
  644. text-transform:none;
  645. font-size:9px;
  646. -moz-border-radius:3px;
  647. -webkit-border-radius:3px;
  648. border-radius:3px;
  649. }
  650.  
  651. .label {
  652. font-weight:bold;
  653. color:{color:title};
  654. }
  655.  
  656. /*audio*/
  657.  
  658. .audio_info {
  659. margin-left:48px;
  660. padding:0 10px;
  661. line-height:45px;
  662. height:45px;
  663. position:relative;
  664. display:block;
  665. overflow-y:hidden;
  666. overflow-x:auto;
  667. background:{color:Accents};
  668. }
  669.  
  670. .tumblr_audio_player {
  671. width:400px;
  672. height:30px;
  673. }
  674.  
  675. .player {
  676. width:25px;
  677. overflow:hidden;
  678. height:25px;
  679. top:3px;
  680. position:absolute;
  681. left:3px;
  682. z-index:2;
  683. border:7px solid white;
  684. border-top-width:5px;
  685. border-bottom-width:9px;
  686. -moz-border-radius:3px;
  687. -webkit-border-radius:3px;
  688. border-radius:3px;
  689. opacity:0;
  690. transition:all .4s ease-in-out;
  691. -webkit-transition:all .4s ease-in-out;
  692. -o-transition:all .4s ease-in-out;
  693. -moz-transition:all .4s ease-in-out;
  694. }
  695.  
  696. .pl:hover .player {opacity:1;}
  697.  
  698. .pl img {
  699. position:absolute;
  700. height:45px;
  701. width:45px;
  702. top:0;
  703. left:0;
  704. z-index:1;
  705. -moz-border-radius:3px;
  706. -webkit-border-radius:3px;
  707. border-radius:3px;
  708. display:block;
  709. }
  710.  
  711. .pl {
  712. float:left;
  713. position:relative;
  714. background:{color:accents};
  715. height:45px;
  716. width:45px;
  717. text-align:center;
  718. line-height:45px;
  719. font-size:10px;
  720. font-weight:bold;
  721. -moz-border-radius:3px;
  722. -webkit-border-radius:3px;
  723. border-radius:3px;
  724. }
  725.  
  726. .pl i {line-height:45px;}
  727.  
  728. /*permalink and notes*/
  729.  
  730. #permalink {
  731. word-break:break-word;
  732. margin-top:3px;
  733. border-top:1px solid {color:borders};
  734. }
  735.  
  736. #permalink a {color:{color:text};}
  737.  
  738.  
  739. #permalink a:hover {color:{color:link hover};}
  740.  
  741. #permalink .cool {
  742. display:block;
  743. line-height:15px;
  744. border-bottom:1px solid {color:borders};
  745. padding:3px 0;
  746. }
  747.  
  748. #permalink .cool:last-of-type {
  749. border:0;
  750. padding-bottom:0;
  751. }
  752.  
  753. #permalink .cool i {
  754. display:inline-block;
  755. background:{color:accents};
  756. font-weight:bold;
  757. line-height:15px;
  758. float:left;
  759. text-align:center;
  760. font-size:7px;
  761. margin-right:3px;
  762. width:15px;
  763. -moz-border-radius:3px;
  764. -webkit-border-radius:3px;
  765. border-radius:3px;
  766. }
  767.  
  768. #permalink .not {
  769. margin-left:18px;
  770. display:block;
  771. }
  772.  
  773. {block:indexpage}
  774.  
  775. .tags {
  776. word-break:break-word;
  777. padding:3px 0 0px 0px;
  778. border-top:1px solid {color:borders};
  779. line-height:15px;
  780. margin-top:3px;
  781. }
  782.  
  783. .crash {margin:0!important;}
  784.  
  785. .posts:hover .tags {opacity:1;}
  786.  
  787. .tags a {margin:0 3px;}
  788.  
  789. .tags a:after {content:',';}
  790.  
  791. .tags a:last-child:after {display:none!important;}
  792.  
  793. .tags i {
  794. display:inline-block;
  795. background:{color:accents};
  796. font-weight:bold;
  797. line-height:15px;
  798. text-align:center;
  799. font-size:7px;
  800. margin-right:3px;
  801. width:15px;
  802. -moz-border-radius:3px;
  803. -webkit-border-radius:3px;
  804. border-radius:3px;
  805. }
  806.  
  807. {/block:indexpage}
  808.  
  809. .tags a {color:{color:text};}
  810.  
  811. .tags a:hover {color:{color:link hover};}
  812.  
  813. .annoy {
  814. position:absolute;
  815. top:-1px;
  816. width:25px;
  817. }
  818.  
  819. .posts:hover .annoy a {opacity:1}
  820.  
  821. .posts.right .annoy {left:-28px;}
  822.  
  823. .posts.left .annoy {right:-28px;}
  824.  
  825. .annoy a {
  826. margin-bottom:3px;
  827. width:23px;
  828. opacity:0;
  829. vertical-align:middle;
  830. border:1px solid {color:borders};
  831. line-height:23px!important;
  832. height:23px;
  833. text-align:center;
  834. font-weight:bold;
  835. color:{color:text};
  836. background:{color:posts};
  837. display:block;
  838. -moz-border-radius:3px;
  839. -webkit-border-radius:3px;
  840. border-radius:3px;
  841. }
  842.  
  843. .annoy i {line-height:23px;}
  844.  
  845. .annoy a:first-of-kind {
  846. -webkit-transition-delay:0s;
  847. -moz-transition-delay:0s;
  848. transition-delay:0s;
  849. }
  850.  
  851. .annoy a:nth-child(2) {
  852. -webkit-transition-delay:.2s;
  853. -moz-transition-delay:.2s;
  854. transition-delay:.2s;
  855. }
  856.  
  857. .annoy a:nth-child(3) {
  858. -webkit-transition-delay:.4s;
  859. -moz-transition-delay:.4s;
  860. transition-delay:.4s;
  861. }
  862.  
  863. .annoy a:hover {background:{color:accents};}
  864.  
  865. /*notes*/
  866.  
  867. .t {color:{color:title};}
  868.  
  869. modal {
  870. display:none;
  871. width:100%;
  872. height:100%;
  873. left:0px;
  874. bottom:0px;
  875. background:{color:background};
  876. z-index:10;
  877. position:fixed;
  878. }
  879.  
  880. .off {
  881. width:100%;
  882. height:100%;
  883. left:0px;
  884. bottom:0px;
  885. z-index:10;
  886. position:fixed;
  887. }
  888.  
  889. .me {
  890. position:absolute;
  891. left:50%;
  892. z-index:11;
  893. width:{select:post width}px;
  894. padding:3px;
  895. border:1px solid {color:borders};
  896. top:50%;
  897. -moz-border-radius:3px;
  898. -webkit-border-radius:3px;
  899. border-radius:3px;
  900. background:{color:posts};
  901. transform: translate(-50%,-50%);
  902. -webkit-transform: translate(-50%,-50%);
  903. -o-transform: translate(-50%,-50%);
  904. -moz-transform: translate(-50%,-50%);
  905. }
  906.  
  907. .same {
  908. max-height:300px;
  909. overflow-y:auto;
  910. }
  911.  
  912. .same::-webkit-scrollbar {width:2px;}
  913.  
  914. .same ol {
  915. margin:0;
  916. padding:0;
  917. }
  918.  
  919. .same img {display:none!important;}
  920.  
  921. .same li {
  922. list-style-type:none;
  923. text-align:left;
  924. padding:5px;
  925. margin:0;
  926. -moz-border-radius:3px;
  927. -webkit-border-radius:3px;
  928. border-radius:3px;
  929. }
  930.  
  931. .same li:nth-child(odd) {background:{color:accents};}
  932.  
  933. .more_notes_link {
  934. display:block;
  935. border-bottom:0;
  936. text-align:left;
  937. color:{color:title};
  938. }
  939.  
  940. {customCss}
  941.  
  942. /* photoset by pixelunion */
  943.  
  944. .clearit:before, .clearit:after {
  945. content: "";
  946. display: table;
  947. }
  948.  
  949. .clearit:after {clear: both;}
  950.  
  951. .clearit { *zoom: 1; }
  952.  
  953. /* Photoset */
  954.  
  955. .photo-slideshow {visibility:hidden;}
  956.  
  957. .photo-slideshow.processed {
  958. visibility:visible;
  959. margin:0;
  960. display:block;
  961. }
  962.  
  963. .photo-slideshow a {border:0;}
  964.  
  965. .photo-slideshow .row {
  966. clear:both;
  967. width:100%;
  968. }
  969.  
  970. .photo-slideshow .row:last-of-type {margin-bottom:0!important;}
  971.  
  972. .photo-slideshow .pxu-photo {
  973. display:block;
  974. float:left;
  975. margin-bottom: 0;
  976. width: 100%;
  977. overflow: hidden;
  978. }
  979.  
  980. .photo-slideshow .pxu-photo img {display: block;}
  981.  
  982. .photo-slideshow.processed .pxu-photo img {
  983. width: 100%;
  984. height: auto;
  985. display:block;
  986. }
  987.  
  988. .photo-slideshow .pxu-photo:first-child img {margin-left: 0;}
  989.  
  990. .photo-slideshow .count-1 {width: 100%;}
  991.  
  992. .photo-slideshow .count-2 {width: 50%;}
  993.  
  994. .photo-slideshow .count-3 {width: 33.33%;}
  995.  
  996. .photo-slideshow .count-4 {width: 25%;}
  997.  
  998. .photo-slideshow .count-5 {width: 20%;}
  999.  
  1000. .photo-slideshow .info {display: none;}
  1001.  
  1002. /* Icons for EXIF Data and Zoom */
  1003.  
  1004. .photo-data {
  1005. position: relative;
  1006. float: left;
  1007. }
  1008.  
  1009. .icons {display:none;}
  1010.  
  1011. .icons > span, .icons .tumblr-box span {display:none;}
  1012.  
  1013. .zoom {display:none;}
  1014.  
  1015. .info {display:none;}
  1016.  
  1017. /* EXIF & CAPTION Data Tooltip */
  1018.  
  1019. .pxu-data {display:none;}
  1020.  
  1021. .pxu-caption {display:none;}
  1022.  
  1023. .pxu-data table {display:none;}
  1024.  
  1025. .tumblr-box {
  1026. display:block;
  1027. position:absolute;
  1028. top:0;
  1029. right:0;
  1030. bottom:0;
  1031. left:0;
  1032. z-index:1;
  1033. }
  1034.  
  1035. @-webkit-keyframes fade-in {
  1036. 0% { opacity: 0; }
  1037. 50% { opacity: 0; }
  1038. 100% { opacity: 1; }
  1039. }
  1040.  
  1041. @-webkit-keyframes fade-in {
  1042. 0% { opacity: 0; }
  1043. 50% { opacity: 0; }
  1044. 100% { opacity: 1; }
  1045. }
  1046.  
  1047. @-moz-keyframes fade-in {
  1048. 0% { opacity: 0; }
  1049. 50% { opacity: 0; }
  1050. 100% { opacity: 1; }
  1051. }
  1052.  
  1053. @keyframes fade-in {
  1054. 0% { opacity: 0; }
  1055. 50% { opacity: 0; }
  1056. 100% { opacity: 1; }
  1057. }
  1058.  
  1059. #top {
  1060. position:fixed;
  1061. left:0;
  1062. right:0;
  1063. top:0;
  1064. z-index:12;
  1065. background:{color:search bar};
  1066. height:35px;
  1067. border-bottom:1px solid {color:borders};
  1068. }
  1069.  
  1070. input[type="search"] {
  1071. -webkit-appearance:textfield;
  1072. -moz-box-sizing:content-box;
  1073. -webkit-box-sizing:content-box;
  1074. box-sizing:content-box;
  1075. }
  1076.  
  1077. input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance:none;}
  1078.  
  1079. .search-form {
  1080. border:none;
  1081. display:block;
  1082. width:120px;
  1083. position:Relative;
  1084. margin-left:5px;
  1085. height:25px!important;
  1086. margin-top:5px;
  1087. }
  1088.  
  1089. .search-form input {
  1090. width:120px;
  1091. position:Relative;
  1092. padding:0 5px!important;
  1093. height:25px!important;
  1094. line-height:25px!important;
  1095. font-size:7px;
  1096. background:{color:accents};
  1097. text-transform:uppercase;
  1098. font-family:trebuchet ms;
  1099. letter-spacing:1px;
  1100. display:block;
  1101. outline:none;
  1102. border:0;
  1103. transition:0.8s;
  1104. -o-transition-duration:0.8s;
  1105. -webkit-transition-duration:0.8s;
  1106. -moz-transition-duration:0.8s;
  1107. }
  1108.  
  1109. .search-form input[type=text] {color:{color:text};}
  1110.  
  1111. .search-form input:focus{
  1112. outline:none;
  1113. width:200px;
  1114. transition:0.8s;
  1115. -o-transition-duration:0.8s;
  1116. -webkit-transition-duration:0.8s;
  1117. -moz-transition-duration:0.8s;
  1118. }
  1119.  
  1120. input::-webkit-input-placeholder {color:{color:text};}
  1121.  
  1122. input::-moz-placeholder {color:{color:text};}
  1123.  
  1124. input:-moz-placeholder {color:{color:text};}
  1125.  
  1126. input:-ms-input-placeholder {color:{color:text};}
  1127.  
  1128. /* SECTIONS */
  1129. .section {
  1130. clear: both;
  1131. padding: 0px;
  1132. margin: 0px;
  1133. }
  1134.  
  1135. /* COLUMN SETUP */
  1136. .col {
  1137. display: block;
  1138. float:left;
  1139. margin: 1% 0 1% 1.6%;
  1140. }
  1141. .col:first-child { margin-left: 0; }
  1142.  
  1143. /* GROUPING */
  1144. .group:before,
  1145. .group:after { content:""; display:table; }
  1146. .group:after { clear:both;}
  1147. .group { zoom:1; /* For IE 6/7 */ }
  1148. /* GRID OF FOUR */
  1149. .span_4_of_4 {
  1150. width: 100%;
  1151. }
  1152. .span_3_of_4 {
  1153. width: 74.6%;
  1154. }
  1155. .span_2_of_4 {
  1156. width: 49.2%;
  1157. }
  1158. .span_1_of_4 {
  1159. width: 23.8%;
  1160. position:fixed;
  1161. }
  1162.  
  1163. /* GO FULL WIDTH BELOW 480 PIXELS */
  1164. @media only screen and (max-width: 480px) {
  1165. .col { margin: 1% 0 1% 0%; }
  1166. .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; padding-left:-10%; padding-right:-10%;}
  1167. .span_1_of_4{ width: 100%; position:static;}
  1168. }
  1169.  
  1170. </style>
  1171.  
  1172.  
  1173. <body>
  1174.  
  1175. {block:ifsearchbar}<div id="top"><form action="/search" class="search-form" method="get"><input id="searchField" name="q" placeholder="Search" type="text" value="{SearchQuery}"/></form></div>{/block:ifsearchbar}
  1176.  
  1177. <div class="section group">
  1178. <div class="col span_1_of_4">
  1179. <aside class="{select:sidebar position}">{block:ifSidebarImage}<a class="eek" href="/"><img src="{image:Sidebar}"/></a>{/block:ifSidebarImage}<a id="te" href="/">{title}</a><div class="tex c">{name}</div><div id="d">{description}</div>
  1180. <nav class="c"><a href="/"><span>1</span>{text:Home Title}</a><a href="/ask"><span>2</span>{text:Ask Title}</a><a href="/archive"><span>3</span>{text:archive title}</a>{block:ifLink1}<a href="{text:Link 1 URL}"><span>4</span>{text:Link 1}</a>{/block:ifLink1}{block:ifLink2}<a href="{text:Link 2 URL}"><span>5</span>{text:Link 2}</a>{/block:ifLink2}{block:ifLink3}<a href="{text:Link 3 URL}"><span>6</span>{text:Link 3}</a>{/block:ifLink3}</nav> </aside>
  1181. </div>
  1182. <div class="col span_3_of_4">
  1183. <section id="entries">
  1184.  
  1185. {block:Posts}
  1186.  
  1187. <article class="posts {select:sidebar position}">
  1188.  
  1189.  
  1190. {block:Quote}{block:Source}<div id="source"><i class="fa fa-quote-left"></i><span class="c qe">{Source}</span></div>{/block:Source}<div id="titlequote" class="ped">{Quote}</div>{/block:Quote}
  1191.  
  1192. {block:Text}
  1193. {block:Title}<div id="title">{Title}</div>{/block:Title}
  1194. <div class="ped ek {block:title}ed{/block:title}">{Body}</div>
  1195. {/block:Text}
  1196.  
  1197. {block:Link}
  1198. <div id="title"><a href="{URL}">{Name}</a></div>
  1199. {block:Description}<div class="ped ed">{Description}</div>{/block:Description}
  1200. {/block:Link}
  1201.  
  1202. {block:Chat}
  1203. {block:Title}<div id="title">{Title}</div>{/block:Title}
  1204. <ol class="chat {block:title}ed{/block:title}">
  1205. {block:Lines}
  1206. <li class="line {Alt}">
  1207. {block:Label}
  1208. <span class="label c">
  1209. {Label}</span>
  1210. {/block:Label}{Line}</li>
  1211. {/block:Lines}
  1212. </ol>
  1213. {/block:Chat}
  1214.  
  1215. {block:Photo}<div class="photo"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" id="photo_{PostID}"/></div>
  1216. {/block:Photo}
  1217.  
  1218. {block:Photoset}<div class="set"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img alt="{PhotoAlt}" src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div></div>
  1219. {/block:Photoset}
  1220.  
  1221. {block:Answer}
  1222. <div class="as">?<a href="{askerurl}"><img src="{askerportraiturl-64}"/></a></div><div class="q ped"><b>{asker} sent: </b>{Question}</div>
  1223. {block:Answerer}<div class="as cl"><img src="{answererportraiturl-64}"/></div><div class="reb q"><b>{answerer} replied: </b>{Answer}</div>{/block:Answerer}
  1224. <div class="a ped" {block:Answerer}style="padding:0"{/block:Answerer}>{replies}</div>
  1225. {/block:Answer}
  1226.  
  1227. {block:Video}<div class="vi">{Video-500}</div>{/block:Video}
  1228.  
  1229. {block:Audio}
  1230. {block:AudioPlayer}<div class="pl">{block:AlbumArt}<img src="{AlbumArtURL}"/>{/block:AlbumArt}<i class="fa fa-music"></i><div class="player">{AudioPlayerwhite}</div></div>{/block:AudioPlayer}<div class="audio_info c">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist} by {Artist}{/block:Artist}</div>
  1231. {/block:Audio}
  1232.  
  1233.  
  1234. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1235.  
  1236. {block:indexpage}{block:ifnothidetags}{block:HasTags}<div class="tags {block:Caption}crash{/block:Caption}{block:Text}crash{/block:Text}{block:Link}crash{/block:Link}{block:answer}crash{/block:answer}"><i class="fa fa-tag"></i>{block:Tags}<a href="{TagUrl}" class="c">{Tag}</a>{/block:Tags}</div>{/block:HasTags}{/block:ifnothidetags}{/block:indexpage}
  1237.  
  1238. {block:Date}{block:indexpage}<div class="annoy"><a href="{Permalink}" title="{timeago}" target="_blank"><i class="fa fa-clock-o"></i></a>{block:NoteCount}<a href="{Permalink}" title="{NoteCountwithlabel}"><i class="fa fa-heart"></i></a>{/block:NoteCount}<a href="{ReblogURL}" target="_blank" title="reblog"><i class="fa fa-refresh"></i></a></div>{/block:indexpage}
  1239.  
  1240. {block:permalinkpage}<div id="permalink" class="c"><span class="cool"><i class="fa fa-clock-o"></i><span class="not">posted on {month} {dayofmonth}{dayofmonthsuffix}, {year} at {12hour}:{minutes}{ampm}</span></span>{block:RebloggedFrom}<span class="cool"><i class="fa fa-location-arrow"></i><span class="not">via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:ContentSource} &mdash; source: <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:ContentSource}</span></span>{/block:RebloggedFrom}{block:HasTags}<span class="tags cool"><i class="fa fa-tag"></i><span class="not">{block:Tags}<a href="{TagUrl}" style="margin-right:3px">#{Tag}</a>{/block:Tags}</span></span>{/block:HasTags}{block:notecount}<span class="cool"><i class="fa fa-heart"></i><span class="not"><a class="t">{notecountwithlabel}</a></span></span>{/block:notecount}</div>{/block:permalinkpage}
  1241. {/block:Date}
  1242.  
  1243. </article>
  1244.  
  1245.  
  1246. {/block:Posts}
  1247. {block:Pagination}<div id="pagination" class="c">{block:previousPage}<a href="{previousPage}">back</a>{block:nextpage}/{/block:nextpage}{/block:previousPage}{block:NextPage}<a href="{NextPage}" id="next">Next</a>{/block:NextPage}</div>{/block:Pagination}
  1248.  
  1249. </section>
  1250. </div>
  1251. </div>
  1252.  
  1253.  
  1254. <modal><div class="off"></div><div class="me"><div class="same c">{PostNotes}</div></div></modal>
  1255.  
  1256.  
  1257.  
  1258. {block:ContentSource}
  1259. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1260. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1261. {/block:SourceLogo}
  1262. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1263. {/block:ContentSource}
  1264.  
  1265. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1266. <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  1267. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1268. <script>
  1269. $(document).ready(function(){
  1270. $('.photo-slideshow').pxuPhotoset({
  1271. lightbox: true,
  1272. rounded: false,
  1273. gutter: '3px',
  1274. photoset: '.photo-slideshow',
  1275. photoWrap: '.photo-data',
  1276. photo: '.pxu-photo'
  1277. });
  1278. $('.off, .t').click(function() {
  1279. $('modal').fadeToggle(400);
  1280. });
  1281. $(document).tooltip({
  1282. track:true
  1283. });
  1284. $('.up').click(function() {
  1285. $('body, html').animate({scrollTop:0}, 1000);
  1286. });
  1287. });
  1288. </script>
  1289.  
  1290. {block:indexpage}{block:ifinfinitescroll}
  1291. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1292. <script>
  1293. $(document).ready(function(){
  1294. var $container = $('#entries');
  1295. $container.infinitescroll({
  1296. itemSelector: '.posts',
  1297. navSelector: '#pagination',
  1298. nextSelector: '#next',
  1299. loadingImg: '',
  1300. loadingText: '<em></em>',
  1301. bufferPx: 100
  1302. },
  1303. function( newElements ) {
  1304. var $newElems = $( newElements );
  1305. $newElems.find('.photo-slideshow').pxuPhotoset({
  1306. lightbox: true,
  1307. rounded: false,
  1308. gutter: '3px',
  1309. photoset: '.photo-slideshow',
  1310. photoWrap: '.photo-data',
  1311. photo: '.pxu-photo'
  1312. });
  1313. });
  1314. });
  1315. </script>
  1316. {/block:ifinfinitescroll}{/block:indexpage}
  1317. <a class="nice" href="http://sorrism.tumblr.com" target="_blank">@</a>
  1318. </body>
  1319.  
  1320. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement