API tools faq
paste
Advertisement
sarahthemes

Theme 008 by heytonks.tumblr.com

sarahthemes
Jan 31st, 2015
3,601
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.19 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5.  
  6. <!-- theme 008 by heytonks.tumblr.com - do not remove credit, redistribute, claim as your own, or use any part of this coding in your own theme. violation of these rules will result in being reported as a code thief. if you have any questions, feel free to send me a message on my personal blog (heytonks) or theme blog (sarahthemes) and i will happily assist you -->
  7.  
  8.  
  9. <html>
  10.  
  11. <head>
  12.  
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}" />
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  16. {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description}
  17. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  18.  
  19. <!-- default variables -->
  20.  
  21. <meta name="text:Title position from bottom" content="410px"/>
  22. <meta name="text:Title position from horizontal center" content="145px"/>
  23. <meta name="text:Link 1 URL" content="/"/>
  24. <meta name="text:Link 1" content="home"/>
  25. <meta name="text:Link 2 URL" content="/ask"/>
  26. <meta name="text:Link 2" content="message"/>
  27. <meta name="text:Link 3 URL" content="/"/>
  28. <meta name="text:Link 3" content="link 3"/>
  29. <meta name="text:Link 4 URL" content="/"/>
  30. <meta name="text:Link 4" content="link 4"/>
  31. <meta name="text:Link 5 URL" content="/"/>
  32. <meta name="text:Link 5" content="link 5"/>
  33. <meta name="text:Link 6 URL" content="/"/>
  34. <meta name="text:Link 6" content="link 6"/>
  35. <meta name="text:Link 7 URL" content="/"/>
  36. <meta name="text:Link 7" content="link 7"/>
  37. <meta name="text:Custom Cursor URL" content=""/>
  38.  
  39. <meta name="image:Background" content=""/>
  40. <meta name="image:Header" content=""/>
  41.  
  42. <meta name="color:Background" content="#f9f9f9"/>
  43. <meta name="color:Header Background" content="#000">
  44. <meta name="color:Nav Bar Background" content="#fdfdfd">
  45. <meta name="color:Nav Bar Links" content="#a5a5a5">
  46. <meta name="color:Nav Bar Links Hover" content="#37caea">
  47. <meta name="color:Nav Bar Text" content="#333">
  48. <meta name="color:Title" content="#64e3ff"/>
  49. <meta name="color:Description" content="#fafafa">
  50. <meta name="color:Post Background" content="#fff">
  51. <meta name="color:Post Text" content="#555"/>
  52. <meta name="color:Bolded Text" content="#555"/>
  53. <meta name="color:Italicized Text" content="#555"/>
  54. <meta name="color:Post Border" content="#ccc"/>
  55. <meta name="color:Post Links" content="#cc5c5c"/>
  56. <meta name="color:Post Links Hover" content="#ffb6b6"/>
  57. <meta name="color:Post Info Box" content="#fafafa"/>
  58. <meta name="color:Post Info Box Hover" content="#9bedff"/>
  59. <meta name="color:Post Info Text" content="#666666"/>
  60. <meta name="color:Post Info Text Hover" content="#231413"/>
  61. <meta name="color:Scrollbar" content="#ff7373"/>
  62. <meta name="color:Text Shadow" content="#d4d4d4"/>
  63. <meta name="color:Accent" content="#ff796d"/>
  64. <meta name="color:Tags" content="#444"/>
  65. <meta name="color:Tags Hover" content="#ff796d"/>
  66. <meta name="color:Tags Background" content="#fff"/>
  67.  
  68. <meta name="if:Full Header Image" content="0">
  69. <meta name="if:Two Columns" content="0">
  70. <meta name="if:Show Asker Icon" content="0">
  71.  
  72. <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
  73.  
  74. <link href='http://fonts.googleapis.com/css?family=Special+Elite' rel='stylesheet' type='text/css'>
  75.  
  76. </head>
  77.  
  78. <style type="text/css">
  79.  
  80. @font-face{
  81. font-family: 'Lato Light';
  82. src: url('http://static.tumblr.com/vdw1lg6/pKsna7gl9/lato-regular-webfont.svg') format('svg');
  83. }
  84.  
  85. @font-face{
  86. font-family: 'Lato Bold';
  87. src: url('http://static.tumblr.com/vdw1lg6/Hdmna7gt2/lato-black-webfont.svg') format('svg');
  88. }
  89.  
  90. @font-face{
  91. font-family: 'Lato Italic';
  92. src: url('http://static.tumblr.com/vdw1lg6/0VKna7jrj/lato-italic-webfont.svg') format('svg');
  93. }
  94.  
  95. @font-face{
  96. font-family: 'SpecialElite';
  97. src: url('http://static.tumblr.com/vdw1lg6/2MFna7js7/specialelite-webfont.svg') format('svg');
  98. }
  99.  
  100.  
  101. html, html a {
  102. -webkit-font-smoothing: antialiased;
  103. text-shadow: 0px 1px 1px white;
  104. }
  105.  
  106. iframe#tumblr_controls {
  107. top: 0% !important;
  108. right:0% !important;
  109. position: fixed !important;
  110. }
  111.  
  112. *, body, a, a:hover {
  113. cursor: url('{text:Custom Cursor URL}'), auto;
  114. }
  115.  
  116. html::-webkit-scrollbar-thumb:vertical {
  117. background-color:{color:Scrollbar};
  118. height: 60px;
  119. }
  120.  
  121.  
  122. html::-webkit-scrollbar {
  123. height: 10px;
  124. width: 8px;
  125. background-color: #000;
  126. z-index:999;
  127. }
  128.  
  129. #notecontainer::-webkit-scrollbar-thumb:vertical {
  130. background-color:{color:Scrollbar};
  131. height: 60px;
  132. }
  133.  
  134.  
  135. #notecontainer::-webkit-scrollbar {
  136. height: 10px;
  137. width: 8px;
  138. background-color:#000;
  139. z-index:999;
  140. }
  141.  
  142. ::selection {
  143. background:{color:Post Links};
  144. color:{color:Post Background};
  145. }
  146.  
  147. ::-moz-selection {
  148. background:{color:Post Links};
  149. color:{color:Post Background};
  150. }
  151.  
  152. ::-webkit-selection {
  153. background:{color:Post Links};
  154. color:{color:Post Background};
  155. }
  156.  
  157. html, body {
  158. background-color:{color:Background};
  159. background-image:url('{image:Background}');
  160. background-repeat:repeat;
  161. background-attachment:fixed;
  162. margin:0px;
  163. font-family: 'Lato Light', 'Lato', sans-serif;
  164. font-weight:400;
  165. font-size:12px;
  166. letter-spacing:1.2px;
  167. color:#555;
  168. line-height:160%;
  169. text-align:justify;
  170. height:100%;
  171. width:100%;
  172. position:relative;
  173. word-wrap:break-word;
  174. }
  175.  
  176. sub, small {
  177. font-size:10px;
  178. }
  179.  
  180.  
  181. a {
  182. text-decoration:none;
  183. color:{color:Post Links};
  184. transition-duration:0.4s;
  185. -moz-transition-duration:0.4s;
  186. -webkit-transition-duration:0.4s;
  187. -o-transition-duration:0.4s;
  188. }
  189.  
  190. a:hover {
  191. color:{color:Post Links Hover};
  192. transition-duration:0.4s;
  193. -moz-transition-duration:0.4s;
  194. -webkit-transition-duration:0.4s;
  195. -o-transition-duration:0.4s;
  196. }
  197.  
  198.  
  199. h1 {
  200. margin-top:0px;
  201. background-color:#f9f9f9;
  202. padding:20px;
  203. border-left:4px solid #64e3ff;
  204. font-size:17px;
  205. line-height:25px;
  206. letter-spacing:1px;
  207. text-align:center;
  208. font-family:'SpecialElite', 'Special Elite', 'Courier', serif;
  209. }
  210.  
  211. h1 a {
  212. border-bottom:1px dotted {color:Post Links};
  213. }
  214.  
  215. blockquote {
  216. border-left:1px dotted {color:Post Text};
  217. padding-left:15px;
  218. margin:-8px 0px 0px 0px;
  219. }
  220.  
  221. b, strong {
  222. font-family:'Lato Bold', 'Lato';
  223. font-weight:700;
  224. color:{color:Bolded Text};
  225. }
  226.  
  227. i, em {
  228. font-style:italic;
  229. font-family:'Lato Italic', 'Lato';
  230. color:{color:Italicized Text};
  231. }
  232.  
  233. #container {
  234. position:relative;
  235. width:100%;
  236. height:100%;
  237. overflow-x:hidden;
  238. }
  239.  
  240. #header {
  241. background-image:url('{image:Header}');
  242. background-repeat:no-repeat;
  243. {block:ifFullHeaderImage}
  244. background-position:top center;
  245. background-size:cover;
  246. -webkit-background-size: cover;
  247. -moz-background-size: cover;
  248. -o-background-size: cover;
  249. {/block:ifFullHeaderImage}
  250. {block:ifNotFullHeaderImage}
  251. background-size:auto auto;
  252. background-position:bottom center;
  253. {/block:ifNotFullHeaderImage}
  254. position:absolute;
  255. overflow:hidden;
  256. background-color:{color:Header Background};
  257. width:100%;
  258. height:100%;
  259. min-height:100%;
  260. padding:0px;
  261. margin:0px;
  262. }
  263.  
  264. #title {
  265. text-transform:uppercase;
  266. color:{color:Title};
  267. font-family: 'Courier';
  268. font-size:32px;
  269. letter-spacing:2px;
  270. position:absolute;
  271. left:50%; /* DON'T CHANGE THIS FOR POSITIONINING, CHANGE THE ONES BELOW */
  272. bottom:{text:Title position from bottom}; /* CHANGE THIS LINE TO ADJUST VERTICAL TITLE POSITION */
  273. margin-left:{text:Title position from horizontal center}; /* CHANGE THIS LINE TO ADJUST HORIZONTAL TITLE POSITION */
  274. text-align:right;
  275. line-height:120%;
  276. width:200px;
  277. }
  278.  
  279. #title a {
  280. border-bottom:1px dotted {color:Text Shadow};
  281. color:{color:Title};
  282. }
  283.  
  284. #bottombar {
  285. background-color:{color:Nav Bar Background};
  286. padding:50px 0px;
  287. position:relative;
  288. z-index:999;
  289. height:auto;
  290. transition-duration:0.4s;
  291. -moz-transition-duration:0.4s;
  292. -webkit-transition-duration:0.4s;
  293. -o-transition-duration:0.4s;
  294. }
  295.  
  296. #bottombar p {
  297. width:570px;
  298. font-size:14px;
  299. font-family: 'Courier', cursive;
  300. font-weight:100;
  301. letter-spacing:1.5px;
  302. opacity:0.7;
  303. height:auto;
  304. line-height:25px;
  305. padding:10px 0px;
  306. text-align:center;
  307. color:{color:Nav Bar Text};
  308. }
  309.  
  310. #bottombar.shrink {
  311. padding:25px 0px;
  312. transition-duration:0.4s;
  313. -moz-transition-duration:0.4s;
  314. -webkit-transition-duration:0.4s;
  315. -o-transition-duration:0.4s;
  316. }
  317.  
  318.  
  319. #bottombar.shrink p {
  320. display:none;
  321. height:0;
  322. opacity:0;
  323. color:#fff;
  324. }
  325.  
  326. .links {
  327. padding:10px 10px;
  328. line-height:2.5em;
  329. }
  330.  
  331. .links a {
  332. display:inline-block;
  333. text-transform:uppercase;
  334. padding:0px 20px;
  335. font-family:'Lato Bold', 'Lato';
  336. font-weight:700;
  337. font-size:12px;
  338. color:{color:Nav Bar Links};
  339. transition-duration:0.4s;
  340. -moz-transition-duration:0.4s;
  341. -webkit-transition-duration:0.4s;
  342. -o-transition-duration:0.4s;
  343. }
  344.  
  345. .links a:hover {
  346. color:{color:Nav Bar Links Hover};
  347. letter-spacing:3.5px;
  348. transition-duration:0.4s;
  349. -moz-transition-duration:0.4s;
  350. -webkit-transition-duration:0.4s;
  351. -o-transition-duration:0.4s;
  352. }
  353.  
  354. #posts {
  355. padding:25px 25px 0px 25px;
  356. background-color:#ffffff;
  357. border-top:1px dotted {color:Post Border};
  358. border-left:1px dotted {color:Post Border};
  359. border-right:1px dotted {color:Post Border};
  360. color:{color:Post Text};
  361. position:relative;
  362. transition-duration: 2s;
  363. -moz-transition-duration: 2s;
  364. -webkit-transition-duration: 2s;
  365. -o-transition-duration: 2s;
  366. {block:IndexPage}
  367. {block:ifNotTwoColumns}
  368. margin-bottom:70px;
  369. width:500px;
  370. margin-left:auto;
  371. margin-right:auto;
  372. {/block:ifNotTwoColumns}
  373. {block:ifTwoColumns}
  374. margin-bottom:65px;
  375. width:400px;
  376. margin-left:50px;
  377. float:left;
  378. {/block:ifTwoColumns}
  379. {/block:IndexPage}
  380. {block:PermalinkPage}
  381. margin-bottom:60px;
  382. width:500px;
  383. position:relative !important;
  384. float:none;
  385. margin-left:auto;
  386. margin-right:auto;
  387. {/block:PermalinkPage}
  388. }
  389.  
  390. #posts p {
  391. display:block;
  392. max-width:100%;
  393. overflow:hidden;
  394. }
  395.  
  396. #content {
  397. position:relative;
  398. margin-top:70px;
  399. {block:IndexPage}
  400. {block:ifNotTwoColumns}
  401. {/block:ifNotTwoColumns}
  402. {block:ifTwoColumns}
  403. width:1005px;
  404. margin-left:auto;
  405. margin-right:auto;
  406. {/block:ifTwoColumns}
  407. {/block:IndexPage}
  408. {block:PermalinkPage}
  409. margin-left:auto;
  410. position:relative;
  411. margin-right:auto;
  412. {/block:PermalinkPage}
  413. margin-left:auto;
  414. margin-right:auto;
  415. }
  416.  
  417. #centergrid {
  418. {block:IndexPage}
  419. {block:ifTwoColumns}
  420. margin-left:-50px;
  421. {/block:ifTwoColumns}
  422. {/block:IndexPage}
  423. }
  424.  
  425. .pagination {
  426. {block:ifTwoColumns}
  427. display:none;
  428. {/block:ifTwoColumns}
  429. {block:ifNotTwoColumns}
  430. margin-top:140px;
  431. background-color:{color:Nav Bar Background};
  432. width:100%;
  433. padding:100px 0px;
  434. text-align:center;
  435. z-index:90;
  436. font-weight:700;
  437. font-family:'Lato Bold', 'Lato';
  438. {/block:ifNotTwoColumns}
  439. }
  440.  
  441. .pagination a {
  442. text-transform:uppercase;
  443. padding:0px 20px;
  444. font-size:13px;
  445. color:{color:Nav Bar Links};
  446. transition-duration:0.4s;
  447. -moz-transition-duration:0.4s;
  448. -webkit-transition-duration:0.4s;
  449. -o-transition-duration:0.4s;
  450. }
  451.  
  452. .pagination a:hover {
  453. color:{color:Nav Bar Links Hover};
  454. letter-spacing:3.5px;
  455. transition-duration:0.4s;
  456. -moz-transition-duration:0.4s;
  457. -webkit-transition-duration:0.4s;
  458. -o-transition-duration:0.4s;
  459. }
  460.  
  461. #posts img, #posts blockquote {
  462. max-width:100%;
  463. }
  464.  
  465. #posts li {
  466. text-transform:uppercase;
  467. font-size:10px;
  468. max-width:100%;
  469. }
  470.  
  471.  
  472. #notecontainer {
  473. margin-left:auto;
  474. margin-right:auto;
  475. width:100%;
  476. max-width:550px;
  477. border:1px dotted {color:Post Border};
  478. text-transform:uppercase;
  479. font-size:8px;
  480. background-color:{color:Post Background};
  481. text-align:left;
  482. margin-bottom:80px;
  483. overflow-x:hidden;
  484. overflow-y:auto;
  485. max-height:550px;
  486. }
  487.  
  488. #notecontainer a {
  489. color:{color:Post Links};
  490. }
  491.  
  492. #notecontainer a:hover {
  493. color:{color:Post Links Hover};
  494. }
  495.  
  496. ol.notes {
  497. list-style-type:none;
  498. padding:0px;
  499. margin:5px 0px 0px 0px;
  500. }
  501.  
  502. li.note {
  503. padding:10px 20px;
  504. border-bottom:1px dotted {color:Post Border};
  505. list-style-image:url('http://static.tumblr.com/vdw1lg6/f8Fn2ytm8/theme-x.png');
  506. list-style-position:inside;
  507. }
  508.  
  509. li.note img {
  510. display:none;
  511. }
  512.  
  513. li.more_notes_link_container {
  514. list-style-image:none;
  515. list-style-type:none;
  516. border:none;
  517. border-style:none;
  518. background-color:#f1f1f1;
  519. }
  520.  
  521.  
  522. .question {
  523. padding:30px 15px 30px 15px;
  524. line-height:18px;
  525. font-size:11px;
  526. margin-bottom:20px;
  527. border:1px solid #eee;
  528. background-color:#fafafa;
  529. {block:ifNotShowAskerIcon}
  530. padding:30px 15px 30px 15px;
  531. {/block:ifNotShowAskerIcon}
  532. {block:ifShowAskerIcon}
  533. padding:30px 15px 40px 15px;
  534. {/block:ifShowAskerIcon}
  535. }
  536.  
  537. #askerimg img {
  538. {block:ifShowAskerIcon}
  539. border-radius:100%;
  540. padding:5px;
  541. border:1px solid #dddddd;
  542. background-color:#f6f6f6;
  543. margin-top:-49px;
  544. position:absolute;
  545. margin-left:-25px;
  546. {/block:ifShowAskerIcon}
  547. }
  548.  
  549. #quotemark {
  550. font-size:53px;
  551. color:{color:Post Links};
  552. opacity:0.8;
  553. font-family:"Calibri";
  554. margin-top:15px;
  555. position:absolute;
  556. }
  557.  
  558. #quote {
  559. display:block;
  560. margin-left:50px;
  561. font-family:'SpecialElite', 'Special Elite';
  562. font-size:20px;
  563. line-height:30px;
  564. }
  565.  
  566. #quotesource {
  567. margin-top:20px;
  568. text-align:right;
  569. display:block;
  570. background-color:#f9f9f9;
  571. padding:20px;
  572. border:1px solid #f1f1f1;
  573. font-family:'Lato Italic', 'Lato';
  574. font-size:13px;
  575. margin-bottom:15px;
  576. }
  577.  
  578. .tags {
  579. padding:10px 25px 0px 25px;
  580. z-index:50;
  581. text-align:center;
  582. margin-left:auto;
  583. margin-right:auto;
  584. position:relative;
  585. vertical-align:middle;
  586. word-break:break-all;
  587. background-color:{color:Background};
  588. border-left:solid 1px {color:Background};
  589. border-right:solid 1px {color:Background};
  590. {block:IndexPage}
  591. {block:ifTwoColumns}
  592. display:none;
  593. width:400px;
  594. {/block:ifTwoColumns}
  595. {block:ifNotTwoColumns}
  596. width:100%;
  597. margin-left:-26px;
  598. {/block:ifNotTwoColumns}
  599. {/block:IndexPage}
  600. {block:PermalinkPage}
  601. width:500px;
  602. margin-left:-26px;
  603. {/block:PermalinkPage}
  604. }
  605.  
  606. .tags a {
  607. line-height:28px;
  608. margin-left:2px;
  609. vertical-align:middle;
  610. background-color:{color:Tags Background};
  611. padding:4px;
  612. color:{color:Tags};
  613. font-size:12px;
  614. font-family: 'SpecialElite', 'Special Elite';
  615. transition-duration:0.4s;
  616. -moz-transition-duration:0.4s;
  617. -webkit-transition-duration:0.4s;
  618. -o-transition-duration:0.4s;
  619. }
  620.  
  621. .tags a:hover {
  622. color:{color:Tags Hover};
  623. letter-spacing:4px;
  624. transition-duration:0.4s;
  625. -moz-transition-duration:0.4s;
  626. -webkit-transition-duration:0.4s;
  627. -o-transition-duration:0.4s;
  628. }
  629.  
  630. .tag {
  631. padding:0px 6px;
  632. vertical-align:middle;
  633. display:inline-block;
  634. }
  635.  
  636. .tags img {
  637. vertical-align:middle;
  638. opacity:0.4;
  639. width:12px;
  640. height:12px;
  641. }
  642.  
  643. .like_and_reblog_buttons {
  644. display:inline-block;
  645. -moz-transition-duration:0.7s;
  646. -webkit-transition-duration:0.7s;
  647. -o-transition-duration:0.7s;
  648. vertical-align:-5px;
  649. position:relative;
  650. z-index:61;
  651. width:32px;
  652. }
  653.  
  654. .like_and_reblog_buttons li {
  655. list-style:none;
  656. -moz-transition-duration:0.7s;
  657. -webkit-transition-duration:0.7s;
  658. -o-transition-duration:0.7s;
  659. vertical-align:middle;
  660. padding:0px 6px 0px 9px;
  661. }
  662.  
  663. .postinfo {
  664. margin-top:25px;
  665. margin-left:-25px;
  666. position:relative;
  667. z-index:59;
  668. height:30px;
  669. background-color:{color:Post Background};
  670. width:100%;
  671. padding:0px 25px;
  672. }
  673.  
  674. .postinfobox {
  675. font-size:10px;
  676. font-weight:bold;
  677. text-transform:uppercase;
  678. font-family: 'Consolas', 'Courier New';
  679. background-color:{color:Post Info Box};
  680. border:1px dotted {color:Post Border};
  681. padding:8px 13px;
  682. vertical-align:middle;
  683. margin-left:auto;
  684. margin-right:auto;
  685. position:relative;
  686. z-index:60;
  687. transition-duration: 1s;
  688. -moz-transition-duration: 1s;
  689. -webkit-transition-duration: 1s;
  690. -o-transition-duration: 1s;
  691. }
  692.  
  693. #posts:hover .postinfobox {
  694. box-shadow:inset 500px 0px {color:Post Info Box Hover};
  695. -webkit-box-shadow:inset 500px 0px {color:Post Info Box Hover};
  696. transition-duration: 1s;
  697. -moz-transition-duration: 1s;
  698. -webkit-transition-duration: 1s;
  699. -o-transition-duration: 1s;
  700. }
  701.  
  702. #posts:hover {
  703. border-left:1px dotted {color:Post Info Box Hover};
  704. border-top:1px dotted {color:Post Info Box Hover};
  705. border-right:1px dotted {color:Post Info Box Hover};
  706. transition-duration: 2s;
  707. -moz-transition-duration: 2s;
  708. -webkit-transition-duration: 2s;
  709. -o-transition-duration: 2s;
  710. }
  711.  
  712. .bottomborder {
  713. width:100%;
  714. margin-left:-26px;
  715. height:20px;
  716. border-top:1px dotted {color:Post Border};
  717. position:absolute;
  718. margin-top:10px;
  719. background-color:{color:Background};
  720. border-left:1px solid {color:Background};
  721. border-right:1px solid {color:Background};
  722. transition-duration: 2s;
  723. -moz-transition-duration: 2s;
  724. -webkit-transition-duration: 2s;
  725. -o-transition-duration: 2s;
  726. }
  727.  
  728. #posts:hover .bottomborder {
  729. border-top:1px dotted {color:Post Info Box Hover};
  730. transition-duration: 2s;
  731. -moz-transition-duration: 2s;
  732. -webkit-transition-duration: 2s;
  733. -o-transition-duration: 2s;
  734. }
  735.  
  736. .postinfo a {
  737. color:{color:Post Info Text};
  738. }
  739.  
  740. .postinfo a:hover {
  741. color:{color:Post Info Text Hover};
  742. }
  743.  
  744. #chatpost ul {
  745. padding:0px;
  746. margin:-20px -20px -5px -20px;
  747. }
  748.  
  749. .chat li {
  750. list-style-type:none;
  751. padding:10px 20px;
  752. border-bottom:1px solid {color:Post Border};
  753. }
  754.  
  755. .chat li:nth-child(odd) {
  756. background: rgb(0, 0, 0);
  757. background: rgba(0, 0, 0, 0.05);
  758. }
  759.  
  760. .chat li:nth-child(even) {
  761. background-color:{color:Post Background};
  762. }
  763.  
  764. .chat li:last-child {
  765. border-bottom:none;
  766. }
  767.  
  768. #titlechat {
  769. border-left:none;
  770. border-bottom:4px solid #64e3ff;
  771. margin-bottom:20px;
  772. background-color:{color:Post Background};
  773. margin-top:-15px;
  774. width:500px;
  775. margin-left:-20px;
  776. {block:ifTwoColumns}
  777. width:400px;
  778. {/block:ifTwoColumns}
  779. }
  780.  
  781. .caption {
  782. display:block;
  783. margin-top:10px;
  784. }
  785.  
  786. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {
  787. display:none;
  788. }
  789.  
  790. #infscr-loading {
  791. display:none;
  792. }
  793.  
  794. .navigation {
  795. display:none!important;
  796. }
  797.  
  798. .videoWrapper {
  799. height:0;
  800. padding-bottom:56.25%;
  801. position:relative;
  802. }
  803.  
  804. .videoWrapper iframe {
  805. height:100%;
  806. left:0;
  807. position:absolute;
  808. top:0;
  809. width:100%;
  810. }
  811.  
  812. iframe {
  813. width:100%;
  814. }
  815.  
  816. .info-add {
  817. display:none;
  818. }
  819.  
  820. #photoset {
  821. max-width:100%;
  822. overflow:hidden;
  823. }
  824.  
  825. {block:ifTwoColumns}
  826.  
  827. .info-collapse-grid {
  828. display:none;
  829. }
  830.  
  831. {/block:ifTwoColumns}
  832.  
  833. @media only screen and (max-width: 625px) {
  834.  
  835. {block:ifNotTwoColumns}
  836.  
  837. #posts {
  838. width:70%
  839. }
  840.  
  841. #posts img {
  842. max-width:100%;
  843. }
  844.  
  845. #bottombar p {
  846. width:70%;
  847. }
  848.  
  849. .info-add {
  850. display:inline;
  851. }
  852.  
  853. .info-collapse {
  854. display:none;
  855. }
  856.  
  857. {/block:ifNotTwoColumns}
  858.  
  859. }
  860.  
  861. </style>
  862.  
  863. <body>
  864.  
  865. <div id="top"></div>
  866.  
  867. <div id="container"><a href="/">
  868.  
  869. <div id="header">
  870.  
  871. <div id="title"><a href="/">{Title}</a></div>
  872.  
  873. </div> <!-- end header -->
  874. </a></div> <!-- end container -->
  875.  
  876. <div id="bottombar"><center>
  877.  
  878. <div class="links">
  879. {block:iflink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  880. {block:iflink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:iflink1}
  881. {block:iflink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:iflink3}
  882. {block:iflink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>{/block:iflink4}
  883. {block:iflink5}<a href="{text:Link 5 URL}">{text:Link 5}</a>{/block:iflink5}
  884. {block:iflink6}<a href="{text:Link 6 URL}">{text:Link 6}</a>{/block:iflink6}
  885. {block:iflink7}<a href="{text:Link 7 URL}">{text:Link 7}</a>{/block:iflink7}
  886. <!-- REMOVAL OF THE CREDIT IS A VIOLATION OF MY THEME RULES --><a href="http://heytonks.tumblr.com">Theme</a><!-- REMOVAL OF THE CREDIT IS A VIOLATION OF MY THEME RULES -->
  887. </div>
  888.  
  889. <p>{Description}</p>
  890.  
  891. </center></div>
  892.  
  893.  
  894. <!-- posts -->
  895.  
  896. <div id="centergrid">
  897.  
  898. <div id="content">
  899.  
  900. {block:Posts}
  901.  
  902. <div id="posts">
  903.  
  904. {block:ContentSource}
  905. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  906. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  907. {/block:SourceLogo}
  908. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  909. {/block:ContentSource}
  910.  
  911. {block:Text}
  912. {block:Title}<h1>{Title}</h1>{/block:Title}
  913. {block:Title}<div style="margin-top:20px;">{/block:Title}<div style="margin-top:-10px;">{Body}</div>{block:Title}</div>{/block:Title}
  914. {/block:Text}
  915.  
  916. {block:Photo}
  917. {LinkOpenTag}
  918. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>
  919. {LinkCloseTag}
  920. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  921. {/block:Photo}
  922.  
  923. {block:Panorama}
  924. {LinkOpenTag}<img src="{PhotoURL-Panorama}">{LinkCloseTag}
  925. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  926. {/block:Panorama}
  927.  
  928. {block:Photoset}
  929. <div id="photoset">{Photoset}</div>
  930. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  931. {/block:Photoset}
  932.  
  933. {block:Quote}
  934. <div id="quotemark">❝</div>
  935. <div id="quote">{Quote}</div>
  936. {block:Source}<div id="quotesource">— {Source}</div>{/block:Source}
  937. {/block:Quote}
  938.  
  939. {block:Link}
  940. <h1><a href="{URL}">{Name}</a></h1>
  941. {block:Description}{Description}{/block:Description}
  942. {/block:Link}
  943.  
  944. {block:Chat}
  945. <div id="chatpost">
  946. {block:Title}<h1 id="titlechat">{Title}</h1>{/block:Title}
  947. <ul class="chat">
  948. {block:Lines}
  949. <li class="{Alt} user_{UserNumber}">
  950. {block:Label}<b>{Label}</b>{/block:Label}
  951. {Line}</li>{/block:Lines}</ul>
  952. </div>
  953. {/block:Chat}
  954.  
  955. {block:Audio}
  956. {block:AudioEmbed}{AudioEmbed color="white"}{/block:AudioEmbed}
  957. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  958. {/block:Audio}
  959.  
  960. {block:Video}
  961. <div class="videoWrapper">{VideoEmbed-500}</div>
  962. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  963. {/block:Video}
  964.  
  965. {block:Answer}<div id="ask"><center>
  966. <div class="question"><span style="font-size:14px; text-transform:uppercase; font-weight:700; letter-spacing:1.5px; font-family:'Lato Bold', 'Lato';">{Asker} asked:<br/></span><div style="padding-top:5px;">{Question}</div></div>
  967. {block:ifShowAskerIcon}<div id="askerimg"><img src="{AskerPortraitURL-40}"></div>{/block:ifShowAskerIcon}
  968. </center>
  969. {block:ifShowAskerIcon}<div style="margin-top:40px;">{Answer}</div>{/block:ifShowAskerIcon}
  970. {block:ifNotShowAskerIcon}<div style="margin-top:20px;">{Answer}</div>{/block:ifNotShowAskerIcon}
  971. </div>{/block:Answer}
  972.  
  973. <!-- post info -->
  974.  
  975. {block:IndexPage}
  976. <center><div class="postinfo">
  977. <div class="bottomborder"></div>
  978. {block:Date}<div class="like_and_reblog_buttons"><li>{ReblogButton color="gray" size="16"}</li></div> <span class="postinfobox"><span class="info-collapse info-collapse-grid">posted </span><a href="{Permalink}">{TimeAgo}</a><span class="info-collapse"> with <a href="{Permalink}">{NoteCountWithLabel}</a><span class="info-collapse-grid">{block:RebloggedFrom}- <a href="{ReblogParentURL}">via</a> / <a href="{ReblogRootURL}">src</a>{/block:RebloggedFrom}</span></span></span><div class="like_and_reblog_buttons"><li>{LikeButton color="gray" size="16"}</li></div>{/block:Date}
  979. </div></center>
  980. {block:HasTags}<center><div class="tags"><img src="http://static.tumblr.com/vdw1lg6/FJXn789ya/tag2.png">{block:Tags}<span class="tag"><a href="{TagURL}">{Tag}</a></span>{/block:Tags}</div></center>{/block:HasTags}
  981. {/block:IndexPage}
  982.  
  983. {block:PermalinkPage}
  984. <center><div class="postinfo">
  985. <div class="bottomborder"></div>
  986. {block:Date}<div class="like_and_reblog_buttons"><li>{ReblogButton color="gray" size="16"}</li></div> <span class="postinfobox"><span class="info-collapse">posted </span><a href="{Permalink}">{TimeAgo}</a><span class="info-collapse"> with <a href="{Permalink}">{NoteCountWithLabel}</a> {block:RebloggedFrom}- <a href="{ReblogParentURL}">via</a> / <a href="{ReblogRootURL}">src</a>{/block:RebloggedFrom}</span></span><div class="like_and_reblog_buttons"><li>{LikeButton color="gray" size="16"}</li></div>{/block:Date}
  987. </div></center>
  988. {block:HasTags}<center><div class="tags"><img src="http://static.tumblr.com/vdw1lg6/FJXn789ya/tag2.png">{block:Tags}<span class="tag"><a href="{TagURL}">{Tag}</a></span>{/block:Tags}</div></center>{/block:HasTags}
  989. {/block:PermalinkPage}
  990.  
  991. </div> <!-- end posts -->
  992.  
  993. {/block:Posts}
  994.  
  995. {block:PostNotes}<div id="notecontainer">{PostNotes}</div>{/block:PostNotes}
  996.  
  997. </div> <!-- end content -->
  998.  
  999. </div> <!-- end centergrid -->
  1000.  
  1001. <center>
  1002. {block:ifNotTwoColumns}
  1003. {block:Pagination}
  1004. <div class="pagination">{block:PreviousPage}<a href="{PreviousPage}">backwards</a>{/block:PreviousPage} /
  1005. {block:NextPage}<a href="{NextPage}">onwards</a>{/block:NextPage}
  1006. </div>
  1007. {/block:Pagination}
  1008. {/block:ifNotTwoColumns}
  1009.  
  1010. {block:ifTwoColumns}
  1011. <div class="navigation">
  1012. {block:Pagination}
  1013. {block:NextPage}<p id="page_nav"><a style="float:right" href="{NextPage}" id="next">Older ?</a>{/block:NextPage}
  1014. {block:PreviousPage}<a style="float:left" href="{PreviousPage}">? Newer</a></p>{/block:PreviousPage}
  1015. {/block:Pagination}
  1016. </div>
  1017. {/block:ifTwoColumns}
  1018. </center>
  1019.  
  1020. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  1021.  
  1022. {block:ifTwoColumns}
  1023. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  1024. <script src="http://static.tumblr.com/twte3d7/qNulm663d/infinite.js"></script>
  1025.  
  1026. <script type="text/javascript">
  1027. $(window).load(function () {
  1028. $('#content').masonry(),
  1029. $('.masonryWrap').infinitescroll({
  1030. itemSelector : "#posts",
  1031. navSelector : "div.navigation",
  1032. nextSelector : ".navigation a#next",
  1033. bufferPx : 10000,
  1034. extraScrollPx: 10000,
  1035. loadingImg : "",
  1036. loadingText : "",
  1037. },
  1038. function() { $('#content').masonry({ appendedContent: $(this) });
  1039. });
  1040. });
  1041. </script>
  1042. {/block:ifTwoColumns}
  1043.  
  1044. <script type="text/javascript">
  1045. $(function(){
  1046. var stickyRibbonTop = $('#bottombar').offset().top;
  1047. var shrinkHeader = 70;
  1048.  
  1049. $(window).scroll(function(){
  1050. if( $(window).scrollTop() >= stickyRibbonTop ) {
  1051. $('#bottombar').css({position: 'fixed', top: '0px', width:'100%'});
  1052. $('#content').css({"margin-top":"330px"});
  1053. } else {
  1054. $('#bottombar').css({position: 'static', top: '0px'});
  1055. $('#content').css({"margin-top":"70px"});
  1056. }
  1057. });
  1058.  
  1059. $(window).scroll(function() {
  1060. var scroll = getCurrentScroll();
  1061. if ( scroll >= stickyRibbonTop + shrinkHeader ) {
  1062. $('#bottombar').addClass('shrink');
  1063. }
  1064. else {
  1065. $('#bottombar').removeClass('shrink');
  1066. }
  1067. });
  1068. function getCurrentScroll() {
  1069. return window.pageYOffset;
  1070. }
  1071.  
  1072. });
  1073. </script>
  1074.  
  1075. </body>
  1076.  
  1077. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!