API tools faq
paste
Advertisement
octomoosey

cat in a box

octomoosey
Aug 8th, 2016
10,064
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.08 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-- octomoosey @ tumblr -->
  4.  
  5. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6. <head><title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.  
  11. <meta name="color:background" content="#656565">
  12. <meta name="color:containerbg" content="#656565">
  13. <meta name="color:postbg" content="#c3c3c3" />
  14. <meta name="color:postinfobg" content="#333333" />
  15. <meta name="color:toptitle" content="#333333" />
  16. <meta name="color:subtitle" content="#333333" />
  17. <meta name="color:scrollbar" content="#ffffff" />
  18. <meta name="color:italic" content="#a76a71" />
  19. <meta name="color:bold" content="#a76a71" />
  20. <meta name="color:title" content="#a76a71" />
  21. <meta name="color:text" content="#333333">
  22. <meta name="color:link" content="#a76a71">
  23. <meta name="color:linkhover" content="#ffffff">
  24. <meta name="color:mainnav" content="#ffffff">
  25. <meta name="color:mainnavhover" content="#a76a71">
  26. <meta name="color:nav" content="#ffffff">
  27. <meta name="color:description" content="#c3c3c3" />
  28. <meta name="color:descriptionbg" content="#333333" />
  29. <meta name="color:paginationtext" content="#ffffff" />
  30. <meta name="color:paginationlink" content="#ffffff" />
  31. <meta name="color:questiontext" content="#ffffff" />
  32. <meta name="color:questionlink" content="#333333" />
  33. <meta name="color:portraitbackground" content="#333333" />
  34. <meta name="color:portraitborder" content="#ffffff" />
  35. <meta name="color:tooltiptext" content="#ffffff" />
  36. <meta name="color:tooltipborder" content="#333333" />
  37. <meta name="color:tooltipbg" content="#000000" />
  38. <meta name="color:selectiontext" content="#ffffff" />
  39. <meta name="color:selectionbg" content="#8c8c8c" />
  40. <meta name="color:gradient1" content="#a76a71">
  41. <meta name="color:gradient2" content="#a8a8a8">
  42.  
  43. <meta name="text:font size" content="10px" />
  44. <meta name="text:YOURBLOGNAME" content="" />
  45. <meta name="text:askpagetext" content="your ask page text goes here, write what you like and use the usual formatting!" />
  46.  
  47. <meta name="text:subtitle" content="Throw me to the wolves and I'll return leading the pack." />
  48.  
  49. <meta name="text:main link 01" content=""/>
  50. <meta name="text:main link 01 title" content="main link 1"/>
  51. <meta name="text:main link 02" content="">
  52. <meta name="text:main link 02 title" content="main link 2"/>
  53. <meta name="text:main link 03" content=""/>
  54. <meta name="text:main link 03 title" content="main link 3"/>
  55. <meta name="text:main link 04" content=""/>
  56. <meta name="text:main link 04 title" content="main link 4"/>
  57. <meta name="text:main link 05" content=""/>
  58. <meta name="text:main link 05 title" content="main link 5"/>
  59.  
  60. <meta name="text:link 01" content=""/>
  61. <meta name="text:link 01 title" content="link 1"/>
  62. <meta name="text:link 02" content="">
  63. <meta name="text:link 02 title" content="link 2"/>
  64. <meta name="text:link 03" content=""/>
  65. <meta name="text:link 03 title" content="link 3"/>
  66. <meta name="text:link 04" content=""/>
  67. <meta name="text:link 04 title" content="link 4"/>
  68. <meta name="text:link 05" content=""/>
  69. <meta name="text:link 05 title" content="link 5"/>
  70. <meta name="text:link 06" content=""/>
  71. <meta name="text:link 06 title" content="link 6"/>
  72. <meta name="text:link 07" content=""/>
  73. <meta name="text:link 07 title" content="link 7"/>
  74. <meta name="text:link 08" content=""/>
  75. <meta name="text:link 08 title" content="link 8"/>
  76. <meta name="text:link 09" content=""/>
  77. <meta name="text:link 09 title" content="link 9"/>
  78. <meta name="text:link 10" content=""/>
  79. <meta name="text:link 10 title" content="link 10"/>
  80. <meta name="text:link 11" content=""/>
  81. <meta name="text:link 11 title" content="link 11"/>
  82. <meta name="text:link 12" content="">
  83. <meta name="text:link 12 title" content="link 12"/>
  84. <meta name="text:link 13" content=""/>
  85. <meta name="text:link 13 title" content="link 13"/>
  86. <meta name="text:link 14" content=""/>
  87. <meta name="text:link 14 title" content="link 14"/>
  88. <meta name="text:link 15" content=""/>
  89. <meta name="text:link 15 title" content="link 15"/>
  90. <meta name="text:link 16" content=""/>
  91. <meta name="text:link 16 title" content="link 16"/>
  92. <meta name="text:link 17" content=""/>
  93. <meta name="text:link 17 title" content="link 17"/>
  94. <meta name="text:link 18" content=""/>
  95. <meta name="text:link 18 title" content="link 18"/>
  96. <meta name="text:link 19" content=""/>
  97. <meta name="text:link 19 title" content="link 19"/>
  98. <meta name="text:link 20" content=""/>
  99. <meta name="text:link 20 title" content="link 20"/>
  100.  
  101. <meta name="image:background" content="" />
  102. <meta name="image:header" content="" />
  103. <meta name="image:portrait1" content="" />
  104. <meta name="image:portrait2" content="" />
  105. <meta name="image:portrait3" content="" />
  106. <meta name="image:sidebar" content="" />
  107. <meta name="image:container" content="" />
  108.  
  109. <meta name="if:hidecaptions" content="0"/>
  110. <meta name="if:roundededges" content="1"/>
  111.  
  112. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  113.  
  114. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  115.  
  116. <link href='https://fonts.googleapis.com/css?family=Lora' rel='stylesheet' type='text/css'>
  117.  
  118. <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
  119.  
  120. <link href='https://fonts.googleapis.com/css?family=Share+Tech' rel='stylesheet' type='text/css'>
  121.  
  122. <link href='https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
  123.  
  124. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  125.  
  126. <script>
  127. $(document).ready(function() {
  128. $('.tabs .tab-links a').on('click', function(e) {
  129. var currentAttrValue = $(this).attr('href');
  130. $('.tabs ' + currentAttrValue).fadeIn(1000).siblings().hide();
  131. $(this).parent('li').addClass('active').siblings().removeClass('active');
  132. e.preventDefault();
  133. });
  134. });
  135. </script>
  136.  
  137. <script>
  138. $(document).ready(function() {
  139. $('#filterOptions li a').click(function() {
  140. var ourClass = $(this).attr('class');
  141. $('#filterOptions li').removeClass('active');
  142. $(this).parent().addClass('active');
  143. if(ourClass == 'all') {
  144. $('#ourHolder').children('div.item').show();
  145. }
  146. else {
  147. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  148. $('#ourHolder').children('div.' + ourClass).show();
  149. }
  150. return false;
  151. });
  152. });
  153. </script>
  154.  
  155. </head>
  156. <style>
  157.  
  158. #tumblr_lightbox {
  159. background-color:rgba(255, 255, 255, .9)!important;
  160. z-index:99999!important;}
  161.  
  162. #tumblr_lightbox img {opacity:0;}
  163.  
  164. #tumblr_lightbox_caption {
  165. font-weight:normal!important;
  166. text-shadow:none!important;}
  167.  
  168. #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {
  169. -moz-box-shadow:none!important;
  170. -webkit-box-shadow:none!important;
  171. box-shadow:none!important;
  172. -moz-border-radius:0px!important;
  173. -webkit-border-radius:0px!important;
  174. border-radius:0px!important;
  175. opacity:1!important;}
  176.  
  177. #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {opacity:.4!important;}
  178.  
  179. iframe.tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop, .tmblr-iframe {
  180. position:fixed;
  181. top:10px!important;
  182. right:10px!important;
  183. white-space:nowrap;
  184. opacity:0.7;
  185. transition: 0.7s ease-in-out;
  186. -webkit-transition: 0.7s ease-in-out;
  187. -moz-transition: 0.7s ease-in-out;
  188. -o-transition: 0.7s ease-in-out;}
  189.  
  190. ::-webkit-scrollbar{
  191. height:3px;
  192. width:3px;
  193. background:inherit;}
  194.  
  195. ::-webkit-scrollbar-thumb {background:{color:scrollbar};}
  196.  
  197. ::-webkit-scrollbar-track {background:{color:pageborder};}
  198.  
  199. ::-moz-selection {
  200. color:{color:selectiontext};
  201. background:{color:selectionbg};}
  202.  
  203. ::selection {
  204. color:{color:selectiontext};
  205. background:{color:selectionbg};}
  206.  
  207. body {
  208. margin:0;
  209. overflow:hidden;
  210. font-size: {text:font size};
  211. font-family: 'Roboto', sans-serif;
  212. line-height:150%;
  213. -moz-osx-font-smoothing:grayscale;
  214. -webkit-font-smoothing:antialiased;
  215. font-smoothing:antialiased;
  216. color:{color:text};
  217. background:{color:background};
  218. background-image: url('{image:background}');
  219. background-position: center center;
  220. background-repeat: no-repeat;
  221. background-attachment: fixed;}
  222.  
  223. blockquote {
  224. padding-left:10px;
  225. border-left:1px solid {color:borders};
  226. margin:15px 0px 10px 0px;
  227. text-align:left;}
  228.  
  229. .caption blockquote {
  230. margin:15px 0px 10px 0px;}
  231.  
  232. blockquote img {
  233. max-width:100%;
  234. height:auto;}
  235.  
  236. img {
  237. max-width:100%;
  238. height:auto;}
  239.  
  240. .caption img {
  241. max-width:100%;
  242. height:auto;}
  243.  
  244. .posts img {
  245. max-width:100%;
  246. margin-top:5px;
  247. margin-bottom:5px;}
  248.  
  249. .caption {
  250. margin-top:15px;
  251. {block:ifhidecaptions}
  252. {block:indexpage}
  253. display:none;
  254. {/block:indexpage}
  255. {/block:ifhidecaptions}}
  256.  
  257. a {
  258. color:{color:link};
  259. text-decoration:none;
  260. letter-spacing:1px;
  261. cursor:help;
  262. -webkit-transition: all 0.7s ease;
  263. transition: all 0.7s ease;
  264. -moz-transition: all 0.7s ease;
  265. -o-transition: all 0.7s ease;}
  266.  
  267. a:hover {
  268. letter-spacing:1px;
  269. text-decoration:none;
  270. color:{color:linkhover};}
  271.  
  272. p {
  273. margin:10px 0 10px 0;}
  274.  
  275. p:first-of-type {
  276. margin-top:0;
  277. padding-top:0;}
  278.  
  279. p:last-of-type {
  280. margin-bottom:10px;
  281. padding-bottom:0;}
  282.  
  283. small, sub, sup {
  284. font-size: {text:font size};
  285. vertical-align:baseline;}
  286.  
  287. pre {
  288. white-space: pre-wrap;
  289. white-space: -moz-pre-wrap;
  290. white-space: -pre-wrap;
  291. white-space: -o-pre-wrap;
  292. word-wrap: break-word;}
  293.  
  294. h1, h3, h4, h5, h6 {
  295. text-align:center;
  296. font-family: 'Yanone Kaffeesatz', sans-serif;
  297. font-size:15px;}
  298.  
  299. h2 {
  300. font-size:15px;
  301. font-family: 'Share Tech', sans-serif;
  302. font-weight:700;
  303. margin:0px 0px 10px 0px;
  304. color:{color:title};}
  305.  
  306. b, strong {
  307. font-family: 'Share Tech', sans-serif;
  308. text-transform:uppercase;
  309. font-size: {text:body font size};
  310. color:{color:bold};}
  311.  
  312. i, em {
  313. font-family: 'Yanone Kaffeesatz', sans-serif;
  314. font-size: 14px;
  315. color:{color:italic};
  316. letter-spacing:1.5px;}
  317.  
  318. ol.notes {
  319. width:400px;
  320. list-style-type:none;
  321. text-align:left;
  322. padding:0px;
  323. margin:0px;}
  324.  
  325. ol.notes li.note {
  326. display:block;
  327. padding:0;
  328. margin:5px 0;}
  329.  
  330. ol.notes li.note img.avatar {display:none!important;}
  331.  
  332. a.more_notes_link {
  333. display:block;
  334. text-align:center;
  335. border:0;
  336. color:{color:title};}
  337.  
  338. #containerbg {
  339. {block:ifroundededges}
  340. -webkit-border-radius: 10px;
  341. -moz-border-radius: 10px;
  342. border-radius: 10px;
  343. {/block:ifroundededges}
  344. position:fixed;
  345. padding:5px;
  346. width:930px;
  347. height:520px;
  348. background: -moz-linear-gradient(left, {color:gradient1}; 0%, {color:gradient2} 100%);
  349. background: -webkit-gradient(left top, right top, color-stop(0%, {color:gradient1}), color-stop(100%, {color:gradient2}));
  350. background: -webkit-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  351. background: -o-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  352. background: -ms-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  353. background: linear-gradient(to right, {color:gradient1} 0%, {color:gradient2} 100%);
  354. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:gradient1}', endColorstr='{color:gradient2}', GradientType=1 );
  355. left:50%;
  356. margin-left:-470px;
  357. top:50%;
  358. margin-top:-265px;
  359. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  360. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  361. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  362.  
  363. #container {
  364. {block:ifroundededges}
  365. -webkit-border-radius: 10px;
  366. -moz-border-radius: 10px;
  367. border-radius: 10px;
  368. {/block:ifroundededges}
  369. position:fixed;
  370. padding:5px;
  371. width:910px;
  372. height:500px;
  373. background:{color:containerbg};
  374. background-image: url('{image:container}');
  375. background-repeat: repeat;
  376. background-attachment: fixed;
  377. left:50%;
  378. margin-left:-460px;
  379. top:50%;
  380. margin-top:-255px;
  381. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  382. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  383. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  384.  
  385. #content {
  386. position:absolute;
  387. margin-top:120px;
  388. margin-bottom:50px;
  389. margin-left:450px;
  390. height:360px;
  391. overflow-y:scroll;
  392. width:453px;}
  393.  
  394. .post {
  395. background:{color:postbg};
  396. text-align:left;
  397. padding:20px;
  398. width:400px;
  399. display:block;
  400. -webkit-box-shadow: 5px 0px 10px 2px rgba(0,0,0,0.5);
  401. -moz-box-shadow: 5px 0px 10px 2px rgba(0,0,0,0.5);
  402. box-shadow: 5px 0px 10px 2px rgba(0,0,0,0.5);
  403. opacity:0;
  404. -webkit-animation:fadeIn ease-in 1;
  405. -moz-animation:fadeIn ease-in 1;
  406. animation:fadeIn ease-in 1;
  407. -webkit-animation-fill-mode:forwards;
  408. -moz-animation-fill-mode:forwards;
  409. animation-fill-mode:forwards;
  410. -webkit-animation-duration:1s;
  411. -moz-animation-duration:1s;
  412. animation-duration:1s;}
  413.  
  414. @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  415. @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  416. @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  417. .fade-in {
  418. opacity:0;
  419. -webkit-animation:fadeIn ease-in 1;
  420. -moz-animation:fadeIn ease-in 1;
  421. animation:fadeIn ease-in 1;
  422. -webkit-animation-fill-mode:forwards;
  423. -moz-animation-fill-mode:forwards;
  424. animation-fill-mode:forwards;
  425. -webkit-animation-duration:1s;
  426. -moz-animation-duration:1s;
  427. animation-duration:1s;}
  428.  
  429. .fade-in.one {
  430. -webkit-animation-delay:0s;
  431. -moz-animation-delay:0s;
  432. animation-delay:0s;}
  433.  
  434. .tabbox {
  435. {block:ifroundededges}
  436. -webkit-border-radius: 10px;
  437. -moz-border-radius: 10px;
  438. border-radius: 10px;
  439. {/block:ifroundededges}
  440. background:{color:postbg};
  441. text-align:left;
  442. padding:20px;
  443. width:400px;
  444. display:block;
  445. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  446. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  447. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  448.  
  449. #topbar {
  450. {block:ifroundededges}
  451. -webkit-border-radius: 10px;
  452. -moz-border-radius: 10px;
  453. border-radius: 10px;
  454. {/block:ifroundededges}
  455. position:fixed;
  456. height:80px;
  457. background:#eee;
  458. background-image: url('{image:header}');
  459. width:870px;
  460. margin-top:20px;
  461. margin-left:20px;
  462. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  463. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  464. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  465.  
  466. #toptitle {
  467. margin-top:5px;
  468. position:fixed;
  469. font-family: 'Yanone Kaffeesatz', sans-serif;
  470. color:{color:toptitle};
  471. text-transform:uppercase;
  472. font-size:30px;
  473. padding:20px;
  474. text-shadow: 0px 0px 3px #fff;}
  475.  
  476. #subtitle {
  477. margin-top:10px;
  478. position:fixed;
  479. font-family: 'Yanone Kaffeesatz', sans-serif;
  480. color:{color:subtitle};
  481. text-transform:none;
  482. font-size:12px;}
  483.  
  484. #portrait1 {
  485. position:absolute;
  486. float:left;
  487. margin-top:5px;
  488. right:5px;}
  489.  
  490. #portrait1 img {
  491. -webkit-border-radius: 100%;
  492. -moz-border-radius: 100%;
  493. border-radius: 100%;
  494. padding:10px;
  495. background:{color:portraitbackground};
  496. border: solid 3px {color:portraitborder};
  497. height:45px;}
  498.  
  499. #portrait2 {
  500. position:absolute;
  501. float:left;
  502. margin-top:15px;
  503. right:65px;}
  504.  
  505. #portrait2 img {
  506. -webkit-border-radius: 100%;
  507. -moz-border-radius: 100%;
  508. border-radius: 100%;
  509. padding:7px;
  510. background:{color:portraitbackground};
  511. border: solid 3px {color:portraitborder};
  512. height:25px;}
  513.  
  514. #portrait3 {
  515. position:absolute;
  516. float:left;
  517. margin-top:45px;
  518. right:55px;}
  519.  
  520. #portrait3 img {
  521. -webkit-border-radius: 100%;
  522. -moz-border-radius: 100%;
  523. border-radius: 100%;
  524. padding:5px;
  525. background:{color:portraitbackground};
  526. border: solid 3px {color:portraitborder};
  527. height:15px;}
  528.  
  529. #sidebar {
  530. {block:ifroundededges}
  531. -webkit-border-radius: 10px;
  532. -moz-border-radius: 10px;
  533. border-radius: 10px;
  534. {/block:ifroundededges}
  535. margin-top:120px;
  536. position:fixed;
  537. height:360px;
  538. width:150px;
  539. background:#000;
  540. margin-left:20px;
  541. opacity:0;
  542. -webkit-transition: all 0.7s ease;
  543. transition: all 0.7s ease;
  544. -moz-transition: all 0.7s ease;
  545. -o-transition: all 0.7s ease;}
  546.  
  547. #sidebar:hover {
  548. opacity:0.9;
  549. -webkit-transition: all 0.7s ease;
  550. transition: all 0.7s ease;
  551. -moz-transition: all 0.7s ease;
  552. -o-transition: all 0.7s ease;}
  553.  
  554. #sidebarimage {
  555. {block:ifroundededges}
  556. -webkit-border-radius: 10px;
  557. -moz-border-radius: 10px;
  558. border-radius: 10px;
  559. {/block:ifroundededges}
  560. margin-top:120px;
  561. position:fixed;
  562. height:360px;
  563. width:150px;
  564. background-image: url('{image:sidebar}');
  565. margin-left:20px;
  566. background-repeat: repeat;
  567. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  568. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  569. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  570.  
  571. #sidebarimagetext {
  572. width:110px;
  573. background: -moz-linear-gradient(left, {color:gradient1}; 0%, {color:gradient2} 100%);
  574. background: -webkit-gradient(left top, right top, color-stop(0%, {color:gradient1}), color-stop(100%, {color:gradient2}));
  575. background: -webkit-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  576. background: -o-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  577. background: -ms-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  578. background: linear-gradient(to right, {color:gradient1} 0%, {color:gradient2} 100%);
  579. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:gradient1}', endColorstr='{color:gradient2}', GradientType=1 );
  580. color:{color:paginationtext};
  581. bottom:20px;
  582. left:20px;
  583. font-family: 'Share Tech', sans-serif;
  584. position:absolute;
  585. text-align:center;
  586. font-size:10px;
  587. text-transform:uppercase;
  588. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  589. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  590. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  591.  
  592. #sidebar:hover #sidebarimagetext {
  593. opacity:0;}
  594.  
  595. #description {
  596. {block:ifroundededges}
  597. -webkit-border-radius: 10px;
  598. -moz-border-radius: 10px;
  599. border-radius: 10px;
  600. {/block:ifroundededges}
  601. line-height:130%;
  602. text-align:center;
  603. background:#fff;
  604. position:fixed;
  605. width: 200px;
  606. margin-top: 120px;
  607. margin-left: 190px;
  608. height: 320px;
  609. padding: 20px;
  610. color:{color:description};
  611. background:{color:descriptionbg};
  612. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  613. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  614. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  615.  
  616. .date {
  617. {block:ifroundededges}
  618. -webkit-border-top-left-radius: 10px;
  619. -webkit-border-top-right-radius: 10px;
  620. -moz-border-radius-topleft: 10px;
  621. -moz-border-radius-topright: 10px;
  622. border-top-left-radius: 10px;
  623. border-top-right-radius: 10px;
  624. {/block:ifroundededges}
  625. font-family: 'Share Tech', sans-serif;
  626. background:{color:postinfobg};
  627. padding:10px;
  628. margin-top:0px;
  629. text-align:right;
  630. font-size:9px;
  631. text-transform:uppercase;
  632. width:420px;
  633. -webkit-box-shadow: 5px 0px 10px 2px rgba(0,0,0,0.5);
  634. -moz-box-shadow: 5px 0px 10px 2px rgba(0,0,0,0.5);
  635. box-shadow: 5px 0px 10px 2px rgba(0,0,0,0.5);}
  636.  
  637. .date a {
  638. margin-right:3px;
  639. color:{color:link};
  640. border-bottom:1px solid {color:text};}
  641.  
  642. .date a:hover {
  643. color:{color:linkhover};}
  644.  
  645. .information {
  646. {block:ifroundededges}
  647. -webkit-border-bottom-right-radius: 10px;
  648. -webkit-border-bottom-left-radius: 10px;
  649. -moz-border-radius-bottomright: 10px;
  650. -moz-border-radius-bottomleft: 10px;
  651. border-bottom-right-radius: 10px;
  652. border-bottom-left-radius: 10px;
  653. {/block:ifroundededges}
  654. font-family: 'Share Tech', sans-serif;
  655. background:{color:postinfobg};
  656. padding:10px;
  657. margin-top:0px;
  658. text-align:right;
  659. font-size:9px;
  660. text-transform:uppercase;
  661. width:420px;
  662. margin-bottom:20px;
  663. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  664. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  665. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  666.  
  667. .information a {
  668. margin-right:3px;
  669. color:{color:link};
  670. border-bottom:1px solid {color:text};}
  671.  
  672. .information a:hover {
  673. color:{color:linkhover};}
  674.  
  675. .titlequote {
  676. text-transform:uppercase;}
  677.  
  678. .source {
  679. text-align:center;}
  680.  
  681. .question {
  682. color:{color:questiontext};
  683. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  684. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  685. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  686. background: -moz-linear-gradient(left, {color:gradient1}; 0%, {color:gradient2} 100%);
  687. background: -webkit-gradient(left top, right top, color-stop(0%, {color:gradient1}), color-stop(100%, {color:gradient2}));
  688. background: -webkit-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  689. background: -o-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  690. background: -ms-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  691. background: linear-gradient(to right, {color:gradient1} 0%, {color:gradient2} 100%);
  692. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:gradient1}', endColorstr='{color:gradient2}', GradientType=1 );
  693. padding:20px;
  694. margin-bottom:10px;}
  695.  
  696. .question a {
  697. color:{color:questionlink};}
  698.  
  699. .asker {
  700. text-transform:uppercase;
  701. font-size:12px;}
  702.  
  703. .chat ul {
  704. display:block;
  705. list-style:none;
  706. margin-left:-40px;}
  707.  
  708. .chat li {
  709. padding:3px;
  710. display:block;}
  711.  
  712. .tumblr_audio_player {
  713. width:250px;
  714. height:30px;
  715. margin-top:-2px;}
  716.  
  717. .player {
  718. width:75px;
  719. height:25px;
  720. display:block;
  721. overflow:hidden;}
  722.  
  723. .hold {
  724. background:#e4e4e4;
  725. display:block;
  726. opacity:.7;
  727. padding:15px;}
  728.  
  729. .audio_info {
  730. padding:15px 0;
  731. border-bottom:1px solid {color:borders};}
  732.  
  733. #pagination {
  734. width:200px;
  735. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  736. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  737. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  738. color:#fff;
  739. background: -moz-linear-gradient(left, {color:gradient1}; 0%, {color:gradient2} 100%);
  740. background: -webkit-gradient(left top, right top, color-stop(0%, {color:gradient1}), color-stop(100%, {color:gradient2}));
  741. background: -webkit-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  742. background: -o-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  743. background: -ms-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  744. background: linear-gradient(to right, {color:gradient1} 0%, {color:gradient2} 100%);
  745. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:gradient1}', endColorstr='{color:gradient2}', GradientType=1 );
  746. color:{color:paginationtext};
  747. bottom:20px;
  748. font-family: 'Share Tech', sans-serif;
  749. position:absolute;
  750. text-align:center;
  751. font-size:10px;
  752. text-transform:uppercase;
  753. -webkit-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  754. -moz-box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);
  755. box-shadow: 5px 5px 10px 2px rgba(0,0,0,0.5);}
  756.  
  757. #pagination a {
  758. color:{color:paginationlink};}
  759.  
  760. #s-m-t-tooltip {
  761. max-width:300px;
  762. border-radius: 0px;
  763. padding:4px;
  764. margin:15px 15px 5px 0px;
  765. color:{color:tooltiptext};
  766. border:1px solid {color:tooltipborder};
  767. font-size:10px;
  768. letter-spacing:1px;
  769. background:{color:tooltipbg};
  770. font-family: 'Share Tech', sans-serif;
  771. z-index:99999;}
  772.  
  773. #credit {
  774. z-index:8;
  775. bottom:-3px;
  776. right:3px;
  777. height:30px;
  778. width:30px;
  779. opacity:0.8;
  780. position:fixed;
  781. padding:5px;}
  782.  
  783. .tab {
  784. display:none;}
  785.  
  786. .tab.active {
  787. display:block;}
  788.  
  789. .tab-links:after {
  790. display:inline-block;
  791. clear:both;
  792. content:'';
  793. -moz-border-radius:100%;
  794. -webkit-border-radius:100%;
  795. border-radius:100%;}
  796.  
  797. .tab-links li {
  798. font-family: 'Share Tech', sans-serif;
  799. margin:0px;
  800. display:block;
  801. list-style:none;
  802. z-index:-999;}
  803.  
  804. .tab-links {
  805. position:absolute;
  806. margin-top:25px;
  807. padding:0px;
  808. z-index:999999;
  809. margin-bottom:-170px;}
  810.  
  811. .tab-links a {
  812. color:{color:mainnav};
  813. width:130px;
  814. display:block;
  815. font-size:10px;
  816. letter-spacing:1px;
  817. text-transform:uppercase;
  818. text-align:center;
  819. padding:9px;
  820. -webkit-transition: all 0.7s ease;
  821. transition: all 0.7s ease;
  822. -moz-transition: all 0.7s ease;
  823. -o-transition: all 0.7s ease;}
  824.  
  825. .tab-links a:hover {
  826. color:{color:mainnavhover};
  827. -webkit-transition: all 0.7s ease;
  828. transition: all 0.7s ease;
  829. -moz-transition: all 0.7s ease;
  830. -o-transition: all 0.7s ease;}
  831.  
  832. li.active a, li.active a:hover {
  833. color:{color:mainnavhover};
  834. letter-spacing:3px;
  835. -webkit-transition: all 0.7s ease;
  836. transition: all 0.7s ease;
  837. -moz-transition: all 0.7s ease;
  838. -o-transition: all 0.7s ease;}
  839.  
  840. .pglink {
  841. display:block;
  842. font-family: 'Share Tech', sans-serif;}
  843.  
  844. .pglink a {
  845. font-size:11px;
  846. padding:3px;
  847. text-align:center;
  848. display:block;
  849. color:{color:nav};
  850. margin-bottom:3px;
  851. background: -moz-linear-gradient(left, {color:gradient1}; 0%, {color:gradient2} 100%);
  852. background: -webkit-gradient(left top, right top, color-stop(0%, {color:gradient1}), color-stop(100%, {color:gradient2}));
  853. background: -webkit-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  854. background: -o-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  855. background: -ms-linear-gradient(left, {color:gradient1} 0%, {color:gradient2} 100%);
  856. background: linear-gradient(to right, {color:gradient1} 0%, {color:gradient2} 100%);
  857. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:gradient1}', endColorstr='{color:gradient2}', GradientType=1 );
  858. -webkit-transition: all 0.7s ease;
  859. transition: all 0.7s ease;
  860. -moz-transition: all 0.7s ease;
  861. -o-transition: all 0.7s ease;}
  862.  
  863. .pglink a:hover {
  864. letter-spacing:2px;
  865. -webkit-transition: all 0.7s ease;
  866. transition: all 0.7s ease;
  867. -moz-transition: all 0.7s ease;
  868. -o-transition: all 0.7s ease;}
  869.  
  870. table {}
  871.  
  872. table img {
  873. -webkit-border-radius: 10px;
  874. -moz-border-radius: 10px;
  875. border-radius: 10px;
  876. height:70px;
  877. width:70px;}
  878.  
  879. .tdimg {
  880. width:90px;}
  881.  
  882. .tdtext {}
  883.  
  884. </style>
  885. <body>
  886. <div id="containerbg"></div>
  887. <div id="container">
  888. <div id="topbar"><div id="toptitle">{title}<div id="subtitle">{text:subtitle}</div></div>
  889. <div id="portrait1"><a href="/"><img src="{image:portrait1}"/></a></div>
  890. <div id="portrait2"><a href="/"><img src="{image:portrait2}"/></a></div>
  891. <div id="portrait3"><a href="/"><img src="{image:portrait3}"/></a></div>
  892. </div>
  893. <div id="sidebarimage"><div id="sidebarimagetext">hover for links</div></div>
  894. <div id="sidebar">
  895. <div class="tabs">
  896. <ul class="tab-links">
  897. <li class="active"><a href="/">home</a></li>
  898. <li><a href="#tab2">ask</a></li>
  899. <li><a href="#tab3">navigation</a></li>
  900. <li>{block:ifmainlink01title}<a href="{text:main link 01}">{text:main link 01 title}</a>{/block:ifmainlink01title}</li>
  901. <li>{block:ifmainlink02title}<a href="{text:main link 02}">{text:main link 02 title}</a>{/block:ifmainlink02title}</li>
  902. <li>{block:ifmainlink03title}<a href="{text:main link 03}">{text:main link 03 title}</a>{/block:ifmainlink03title}</li>
  903. <li>{block:ifmainlink04title}<a href="{text:main link 04}">{text:main link 04 title}</a>{/block:ifmainlink04title}</li>
  904. <li>{block:ifmainlink05title}<a href="{text:main link 05}">{text:main link 05 title}</a>{/block:ifmainlink05title}</li>
  905. <li><a href="/archive">archive</a></li>
  906.  
  907. </ul>
  908. </div>
  909.  
  910. </div>
  911.  
  912. <div id="description">
  913. {description}
  914. <div id="pagination">
  915. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">back</a> - {/block:PreviousPage} page {CurrentPage} of {TotalPages}{block:NextPage} - <a href="{NextPage}">forth</a>
  916. {/block:NextPage}
  917. {/block:Pagination}</div>
  918. </div>
  919.  
  920. <div class="tabs">
  921.  
  922. <div id="tab1" class="tab active">
  923. <div id="content">
  924. {block:posts}
  925.  
  926. <div class="date">
  927. {block:Date}
  928. <a href="{permalink}">{DayOfWeek}</a>
  929. {/block:Date}
  930.  
  931. {block:NoteCount}<a href="{permalink}">{NoteCount}</a>{/block:NoteCount}
  932. {block:RebloggedFrom}
  933. <a href="{ReblogParentURL}">via</a>
  934. <a href="{ReblogRootURL}">source</a>
  935. {/block:RebloggedFrom}
  936. </div>
  937. <div class="post">
  938.  
  939. {block:Quote}
  940. <div class="titlequote">{Quote}</div>
  941. {block:Source}<div class="source">{Source}</div>{/block:Source}
  942. {/block:Quote}
  943.  
  944. {block:Text}
  945. {block:Title}<h2>{Title}</h2>{/block:Title}
  946. {Body}
  947. {/block:Text}
  948.  
  949. {block:Link}
  950. <h2><a href="{URL}">{Name}</a></h2>
  951. {block:Description}{Description}{/block:Description}
  952. {/block:Link}
  953.  
  954. {block:Chat}
  955. {block:Title}<h2>{Title}</h2>{/block:Title}
  956. <ol class="chat">
  957. {block:Lines}
  958. <li class="l {Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>
  959. {/block:Lines}
  960. </ol>
  961. {/block:Chat}
  962.  
  963. <center>{Block:Photo}{LinkOpenTag}
  964. <img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}{/Block:Photo}</center>
  965.  
  966. <center>{block:Photoset}<div class="media">{photoset}</div>{/block:Photoset}</center>
  967.  
  968. <center>{block:Video}{Video-400}{/block:Video}</center>
  969.  
  970. {block:Panorama}
  971. {LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" />{LinkCloseTag}
  972. {/block:Panorama}
  973.  
  974. {block:Audio}{block:AudioPlayer}<div class="hold"><div class="player">{AudioPlayergrey}</div></div>{/block:AudioPlayer}<div class="audio_info">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist} by {Artist}{/block:Artist}</div>
  975. {/block:Audio}
  976.  
  977. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  978.  
  979. {block:Answer}
  980. <div class="question">
  981. <div class="asker">{Asker} asked -</div> {question}</div>{answer}{/block:Answer}
  982.  
  983. </div>
  984.  
  985. <div class="information">
  986. {block:HasTags}{block:Tags} <a href="{TagURL}">{Tag}</a>{/block:Tags}
  987. {/block:HasTags}
  988. </div>
  989.  
  990. {block:PostNotes}
  991. <div class="pagenotes">{PostNotes}</div>
  992. {/block:PostNotes}
  993.  
  994. {/block:posts}
  995. </div></div>
  996.  
  997. <div id="tab2" class="tab">
  998. <div id="content">
  999. <div class="tabbox">
  1000. {text:askpagetext}<br><hr><br>
  1001. <p><iframe frameborder="0" height="260" id="ask_form" scrolling="no" src="https://www.tumblr.com/ask_form/{text:YOURBLOGNAME}.tumblr.com" width="100%" style="background-color: transparent; overflow: hidden;"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p>
  1002. </div></div>
  1003. </div>
  1004.  
  1005. <div id="tab3" class="tab">
  1006. <div id="content">
  1007. <div class="tabbox">
  1008. <div class="pglink">
  1009. {block:iflink01title}<a href="{text:link 01}">{text:link 01 title}</a>{/block:iflink01title}
  1010. {block:iflink02title}<a href="{text:link 02}">{text:link 02 title}</a>{/block:iflink02title}
  1011. {block:iflink03title}<a href="{text:link 03}">{text:link 03 title}</a>{/block:iflink03title}
  1012. {block:iflink04title}<a href="{text:link 04}">{text:link 04 title}</a>{/block:iflink04title}
  1013. {block:iflink05title}<a href="{text:link 05}">{text:link 05 title}</a>{/block:iflink05title}
  1014. {block:iflink06title}<a href="{text:link 06}">{text:link 06 title}</a>{/block:iflink06title}
  1015. {block:iflink07title}<a href="{text:link 07}">{text:link 07 title}</a>{/block:iflink07title}
  1016. {block:iflink08title}<a href="{text:link 08}">{text:link 08 title}</a>{/block:iflink08title}
  1017. {block:iflink09title}<a href="{text:link 09}">{text:link 09 title}</a>{/block:iflink09title}
  1018. {block:iflink10title}<a href="{text:link 10}">{text:link 10 title}</a>{/block:iflink10title}
  1019. {block:iflink11title}<a href="{text:link 11}">{text:link 11 title}</a>{/block:iflink11title}
  1020. {block:iflink12title}<a href="{text:link 12}">{text:link 12 title}</a>{/block:iflink12title}
  1021. {block:iflink13title}<a href="{text:link 13}">{text:link 13 title}</a>{/block:iflink13title}
  1022. {block:iflink14title}<a href="{text:link 14}">{text:link 14 title}</a>{/block:iflink14title}
  1023. {block:iflink15title}<a href="{text:link 15}">{text:link 15 title}</a>{/block:iflink15title}
  1024. {block:iflink16title}<a href="{text:link 16}">{text:link 16 title}</a>{/block:iflink16title}
  1025. {block:iflink17title}<a href="{text:link 17}">{text:link 17 title}</a>{/block:iflink17title}
  1026. {block:iflink18title}<a href="{text:link 18}">{text:link 18 title}</a>{/block:iflink18title}
  1027. {block:iflink19title}<a href="{text:link 19}">{text:link 19 title}</a>{/block:iflink19title}
  1028. {block:iflink20title}<a href="{text:link 20}">{text:link 20 title}</a>{/block:iflink20title}
  1029. </div>
  1030. </div></div></div>
  1031.  
  1032. </div></div></div>
  1033.  
  1034. <div id="credit"><a href="https://octomoosey.tumblr.com/" title="theme by octomoosey"><img src="https://static.tumblr.com/uopakca/cwDo0y64u/octopus-24.png"></a></div>
  1035.  
  1036.  
  1037.  
  1038. {block:ContentSource}
  1039. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1040. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1041. {/block:SourceLogo}
  1042. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1043. {/block:ContentSource}
  1044. </body>
  1045.  
  1046. <script src="https//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  1047.  
  1048. <script src="https://static.tumblr.com/fiw4iub/4jdnu5ta4/jquery.style-my-tooltips.js"></script>
  1049.  
  1050. <script>
  1051. (function($){
  1052. $(document).ready(function(){
  1053. $("a[title]").style_my_tooltips({
  1054. tip_follows_cursor:true,
  1055. tip_delay_time:90,
  1056. tip_fade_speed:600,
  1057. attribute:"title"
  1058. });
  1059. });
  1060. })(jQuery);
  1061. </script>
  1062.  
  1063. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  1064. </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!