farflunghopes

insane

Nov 29th, 2012
2,208
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.74 KB | None | 0 0
  1. <!--- theme 12 'Insane' by Brianna @ colorfulmetaphors.tumblr.com
  2.  
  3. Rules:
  4. 1. Do not remove the credit from the code or the theme. You may MOVE it, but leave it on the FIRST page of your blog, ie: it must be visible on the main page.
  5. 2. Do not redistribute this theme.
  6. 3. Do not steal this theme. Taking a portion of the code and adding it to your own theme/others' counts as stealing. If you want to learn how to do something, ask, and I will do my best to help you.
  7. 4. Do not use this theme as a base code.
  8. 5. If you have any problems, find glitches, or just need help, please ask me! That's not really a rule, but I'd love to help.
  9.  
  10. Help:
  11. - Theme looks best in Google Chrome.
  12. - SAVE and REFRESH the page before changing appearance options.
  13. - The background image REPEAT and POSITION can be changed under the appearance options. Select or deslect 'BackgroundImageRepeat' and enter the position in 'bgimgposition'.
  14. - There are EIGHT extra links available. Add them under the appearance options. Try to keep the link names reasonably short.
  15. - There are three options for the post size. The default is grid 250px. For 400px or 500px, select the corresponding under the appearance options. Do not select both.
  16. - The topbar automatically scrolls. To keep it fixed in place, select 'FixedTopbar' under the appearance options.
  17. - The text displayed on the topbar is not your blog title. The text must be entered under 'quote' in the appearance options.
  18. - The BODY font SIZE can be changed under the appearance options. DO NOT add 'px' after the number.
  19. - The 'highlight' and 'highlighttext' color options refer to the background and text color that appears when you click and drag the cursor.
  20.  
  21. Enjoy!
  22.  
  23. --->
  24.  
  25. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  26. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  27. <head><title>{Title}</title>
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  31.  
  32. <link href='http://fonts.googleapis.com/css?family=Rosarivo' rel='stylesheet' type='text/css'>
  33.  
  34. <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Old+Standard+TT:400,400italic' rel='stylesheet' type='text/css'>
  37.  
  38. <link href='http://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'>
  39.  
  40. <link href='http://fonts.googleapis.com/css?family=Ruluko' rel='stylesheet' type='text/css'>
  41.  
  42. <link href='http://fonts.googleapis.com/css?family=Allura' rel='stylesheet' type='text/css'>
  43.  
  44. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  45. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  46. <script>
  47. (function($){
  48. $(document).ready(function(){
  49. $("[title]").style_my_tooltips();
  50. });
  51. })(jQuery);
  52. </script>
  53.  
  54. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  55.  
  56. {block:IfNot400pxPosts}
  57. {block:IfNot500pxPosts}
  58. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  59.  
  60. <script type="text/javascript">
  61. $(window).load(function () {
  62. $('#entries').masonry({
  63. itemSelector : ".post",
  64. },
  65. function() { $('#entries').masonry({ appendedContent: $(this) }); }
  66. );
  67. });
  68. </script>
  69. {/block:IfNot500pxPosts}
  70. {/block:IfNot400pxPosts}
  71.  
  72. <meta name="color:background" content="#ffffff"/>
  73. <meta name="color:sidebar" content="#f5f4f4">
  74. <meta name="color:sidebarborder" content="#e8e8e8">
  75. <meta name="color:topbar" content="#f7f7f7">
  76. <meta name="color:quote" content="#d1d1d1">
  77. <meta name="color:topbarborder" content="#e1e1e1">
  78. <meta name="color:text" content="#888888"/>
  79. <meta name="color:link" content="#333333"/>
  80. <meta name="color:linkhover" content="#999999">
  81. <meta name="color:tags" content="#FFFFFF">
  82. <meta name="color:tagshover" content="#777777">
  83. <meta name="color:tagsbackground" contnet="#EEEEEE">
  84. <meta name="color:infolink" content="#555555">
  85. <meta name="color:infolinkhover" content="#999999">
  86. <meta name="color:sidelink" content="#444444">
  87. <meta name="color:sidelinkhover" content="#CCCCCC">
  88. <meta name="color:sidelinkborder" content="#bebcbc">
  89. <meta name="color:sidelinkborderhover" content="#e7e7e7">
  90. <meta name="color:posts" content="#DDDDDD">
  91. <meta name="color:postsborder" content="#F5f5f5">
  92. <meta name="color:pagination" content="#e8e8e8">
  93. <meta name="color:scrollbarbackground" content="#DDDDDD">
  94. <meta name="color:scrollbar" content="#999999">
  95. <meta name="color:highlight" content="#DDDDDD">
  96. <meta name="color:highlighttext" content="#111111">
  97.  
  98. <meta name="font:body" content="">
  99. <meta name="font:sidebar" content="">
  100.  
  101. <meta name="image:sidebar" content=""/>
  102. <meta name="image:background" content="">
  103.  
  104. <meta name="text:quote" content="">
  105. <meta name="text:bodyfontsize" content="11">
  106. <meta name="text:bgimgposition" content="bottom right" />
  107. <meta name="text:link1" content="/">
  108. <meta name="text:link1name" content="link 1">
  109. <meta name="text:link2" content="/">
  110. <meta name="text:link2name" content="link 2">
  111. <meta name="text:link3" content="/">
  112. <meta name="text:link3name" content="link 3">
  113. <meta name="text:link4" content="/">
  114. <meta name="text:link4name" content="link 4">
  115. <meta name="text:link5" content="/">
  116. <meta name="text:link5name" content="link 5">
  117. <meta name="text:link6" content="/">
  118. <meta name="text:link6name" content="link 6">
  119. <meta name="text:link7" content="/">
  120. <meta name="text:link7name" content="link 7">
  121. <meta name="text:link8" content="/">
  122. <meta name="text:link8name" content="link 8">
  123.  
  124. <meta name="if:BackgroundImageRepeat" content="" />
  125. <meta name="if:400pxPosts" content="">
  126. <meta name="if:500pxPosts" content="">
  127. <meta name="if:FixedTopbar" content="">
  128.  
  129. <style type="text/css">
  130.  
  131. iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  132. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  133.  
  134. ::-webkit-scrollbar {
  135. width: 7px;
  136. background-color:{color:scrollbarbackground};
  137. }
  138.  
  139. ::-webkit-scrollbar-thumb {
  140. width:7px;
  141. background-color:{color:scrollbar};
  142. }
  143.  
  144. ::selection {
  145. background: {color:highlight};
  146. color: {color:highlighttext};
  147. }
  148.  
  149. #s-m-t-tooltip {
  150. z-index: 9999;
  151. background:{color:background};
  152. font-size: 9px;
  153. line-height: 11px;
  154. font-style:italic;
  155. font-family:lucida sans;
  156. border: 1px solid #F0F0F0;
  157. text-transform: lowercase;
  158. color: #AAA;
  159. max-width: 150px;
  160. padding: 5px 10px 5px 10px;
  161. display: block;
  162. margin: 15px 0px 0px -50px;
  163. box-shadow:3px 3px 5px;
  164. }
  165.  
  166. body {
  167. margin:0px;
  168. padding:0px;
  169. background-color:{color:background};
  170. color:{color:text};
  171. font-size:{text:bodyfontsize}px;
  172. font-family:{font:body};
  173. line-height:11px;
  174. background-image:url('{image:background}');
  175. background-attachment:fixed;
  176. background-position:{text:bgimgposition};
  177. {block:IfBackgroundImageRepeat}
  178. background-repeat:repeat;
  179. {/block:IfBackgroundImageRepeat}
  180. {block:IfNotBackgroundImageRepeat}
  181. background-repeat:no-repeat;
  182. {/block:IfNotBackgroundImageRepeat}
  183. }
  184.  
  185. a {
  186. color:{color:link};
  187. text-decoration:none;
  188. outline:none;
  189. -moz-outline-style:none;
  190. -webkit-transition: all 0.6s ease-out;
  191. -o-transition: all 0.6s ease-out;
  192. -webkit-transition: all 0.6s ease-out;
  193. -moz-transition: all 0.6s ease-out;
  194. }
  195.  
  196. a:hover {
  197. color:{color:linkhover};
  198. -webkit-transition: all 0.6s ease-out;
  199. -o-transition: all 0.6s ease-out;
  200. -webkit-transition: all 0.6s ease-out;
  201. -moz-transition: all 0.6s ease-out;
  202. }
  203.  
  204. blockquote {
  205. padding-left:3px;
  206. border-left:2px solid;
  207. }
  208.  
  209. blockquote blockquote {
  210. padding-left:3px;
  211. border-left:2px solid;
  212. }
  213.  
  214. {block:IfNot400pxPosts}
  215. {block:IfNot500pxPosts}
  216. blockquote img {
  217. max-width:200px;
  218. }
  219. {/block:IfNot500pxPosts}
  220. {/block:IfNot400pxPosts}
  221.  
  222. h1 {
  223. font-size:13px;
  224. font-family: 'Rosarivo', serif;
  225. }
  226.  
  227. #entries {
  228. {block:IfNot400pxPosts}
  229. {block:IfNot500pxPosts}
  230. margin-left:375px;
  231. width:600px;
  232. {/block:IfNot500pxPosts}
  233. {/block:IfNot400pxPosts}
  234.  
  235. {block:If400pxPosts}
  236. width:430px;
  237. margin-left:460px;
  238. {/block:If400pxPosts}
  239.  
  240. {block:If500pxPosts}
  241. width:530px;
  242. margin-left:400px;
  243. {/block:If500pxPosts}
  244. {block:IfFixedTopbar}
  245. padding-top:9%;
  246. {/block:IfFixedTopbar}
  247. {block:IfNotFixedTopbar}
  248. padding-top:0%;
  249. {/block:IfNotFIxedTopbar}
  250. z-index:888;
  251. }
  252.  
  253. #post {
  254. padding:10px;
  255. float:left;
  256. margin:10px;
  257. word-wrap:break-word;
  258. width:250px;
  259. background-color:{color:posts};
  260. border:5px solid {color:postsborder};
  261. z-index:888;
  262. {block:IfNot400pxPosts}
  263. {block:IfNot500pxPosts}
  264. overflow:hidden;
  265. width:250px;
  266. {/block:IfNot500pxPosts}
  267. {/block:IfNot400pxPosts}
  268. {block:If400pxPosts}
  269. width:400px;
  270. {/block:If400pxPosts}
  271. {block:If500pxPosts}
  272. width:500px;
  273. {/block:If500pxPosts}
  274. }
  275.  
  276. #sidebar {
  277. padding-bottom:10px;
  278. z-index:999;
  279. padding-top:40px;
  280. background-color:{color:background};
  281. {block:IfFixedTopbar}
  282. position:fixed;
  283. margin-top:-10px;
  284. {/block:IfFixedTopbar}
  285. {block:IfNotFixedTopbar}
  286. position:relative;
  287. margin-top:-10px;
  288. {/block:IfNotFixedTopbar}
  289. {block:IfNot400pxPosts}
  290. width:900px;
  291. margin-left:13%;
  292. {/block:IfNot400pxPosts}
  293. {block:If400pxPosts}
  294. width:800px;
  295. margin-left:18%;
  296. {/block:If400pxPosts}
  297. }
  298.  
  299. #title {
  300. background-color:{color:topbar};
  301. height:30px;
  302. padding:25px 0px 20px 20px;
  303. border-bottom:1px solid {color:topbarborder};
  304. font-size:27px;
  305. word-spacing:7px;
  306. color:{color:quote};
  307. text-indent:40px;
  308. font-style:italic;
  309. line-height:25px;
  310. text-align:left;
  311. font-family: 'Amatic SC', cursive;
  312. text-shadow:2px 2px 5px;
  313. }
  314.  
  315. #floaters {
  316. position:fixed;
  317. height:10px;
  318. {block:IfNot400pxPosts}
  319. width:900px;
  320. {/block:IfNot400pxPosts}
  321. {block:If400pxPosts}
  322. width:800px;
  323. {/block:If400pxPosts}
  324. }
  325.  
  326. #over {
  327. text-align:center;
  328. padding-bottom:10px;
  329. font-family: 'Amatic SC', cursive;
  330. font-size:15px;
  331. padding-left:5px;
  332. padding-right:5px;
  333. word-spacing:4px;
  334. color:{color:sidelink};
  335. border-bottom:1px solid {color:sidebar};
  336. {block:IfFixedTopbar}
  337. margin-top:10px;
  338. padding-bottom:10px;
  339. {/block:IfFixedTopbar}
  340. {block:IfNotFixedTopbar}
  341. padding-bottom:5px;
  342. {/block:IfNotFixedTopbar}
  343. }
  344.  
  345. #sidebarimage {
  346. width:200px;
  347. margin-left:-2px;
  348. }
  349.  
  350. #sidebarimage img {
  351. width:200px;
  352. }
  353.  
  354. #outer {
  355. position:fixed;
  356. top:-11px;
  357. width:196px;
  358. background-color:{color:sidebar};
  359. z-index:111;
  360. height:100%;
  361. border-left: 2px solid {color:sidebarborder};
  362. border-right:2px solid {color:sidebarborder};
  363. -webkit-transition: all 0.6s ease-out;
  364. -o-transition: all 0.6s ease-out;
  365. -webkit-transition: all 0.6s ease-out;
  366. -moz-transition: all 0.6s ease-out;
  367. {block:IfFixedTopbar}
  368. padding-top:127px;
  369. {/block:IfFixedTopbar}
  370. {block:IfNotFixedTopbar}
  371. padding-top:110px;
  372. {/block:IfNotFixedTopbar}
  373. {block:IfNot400pxPosts}
  374. margin-left:13%;
  375. {/block:IfNot400pxPosts}
  376. {block:If400pxPosts}
  377. margin-left:18%;
  378. {/block:If400pxPosts}
  379. }
  380.  
  381. .duo {
  382. width:13px;
  383. height:23px;
  384. overflow:hidden;
  385. padding-right:2px;
  386. margin:10px 0px 10px 35px;
  387. -webkit-transition: all 0.6s ease-out;
  388. -o-transition: all 0.6s ease-out;
  389. -webkit-transition: all 0.6s ease-out;
  390. -moz-transition: all 0.6s ease-out;
  391. }
  392.  
  393. .duo:hover {
  394. -webkit-transition: all 0.6s ease-out;
  395. -o-transition: all 0.6s ease-out;
  396. -webkit-transition: all 0.6s ease-out;
  397. -moz-transition: all 0.6s ease-out;
  398. }
  399.  
  400. #links {
  401. position:absolute;
  402. margin:0px 0px 0px -52px;
  403. width:50px;
  404. height:100px;
  405. }
  406.  
  407. .swirl a {
  408. display:block;
  409. margin-left:10px;
  410. width:20px;
  411. height:20px;
  412. -webkit-transform:rotate(134deg);
  413. -webkit-transition: all 0.6s ease-out;
  414. -o-transition: all 0.6s ease-out;
  415. -webkit-transition: all 0.6s ease-out;
  416. -moz-transition: all 0.6s ease-out;
  417. border:1px solid {color:sidelinkborder};
  418. background-color:{color:sidelinkborder};
  419. }
  420.  
  421. .appear a {
  422. position:absolute;
  423. margin-top:-18px;
  424. font-size:9px;
  425. text-align:right;
  426. color:#999;
  427. color:{color:sidelink};
  428. font-family: 'Ruluko', sans-serif;
  429. width:25px;
  430. padding-bottom:3px;
  431. padding-right:3px;
  432. opacity:0;
  433. border-bottom:1px solid #333;
  434. -webkit-transition: all 0.6s ease-out;
  435. -o-transition: all 0.6s ease-out;
  436. -webkit-transition: all 0.6s ease-out;
  437. -moz-transition: all 0.6s ease-out;
  438. }
  439.  
  440. .duo:hover .swirl a{
  441. width:17px;
  442. height:17px;
  443. margin-left:8px;
  444. color:{color:sidelink};
  445. -webkit-transform:rotate(-90deg);
  446. background-color:{color:sidelinkborderhover};
  447. border:1px solid {color:sidelinkborderhover};
  448. -webkit-transition: all 0.6s ease-out;
  449. -o-transition: all 0.6s ease-out;
  450. -webkit-transition: all 0.6s ease-out;
  451. -moz-transition: all 0.6s ease-out;
  452. }
  453.  
  454. .duo:hover .appear a {
  455. padding-left:5px;
  456. margin-top:-15px;
  457. padding-right:15px;
  458. opacity:1;
  459. color:{color:sidelinkhover};
  460. margin-left:-37px;
  461. -webkit-transition: all 0.6s ease-out;
  462. -o-transition: all 0.6s ease-out;
  463. -webkit-transition: all 0.6s ease-out;
  464. -moz-transition: all 0.6s ease-out;
  465. border-bottom:1px solid {color:sidelinkborderhover};
  466. }
  467.  
  468. #description {
  469. margin-top:10px;
  470. font-size:10px;
  471. margin-left:auto;
  472. margin-right:auto;
  473. text-align:right;
  474. width:180px;
  475. padding-right:5px;
  476. overflow:auto;
  477. height:180px;
  478. font-family:{font:sidebar};
  479. }
  480.  
  481. #under {
  482. margin-left:0px;
  483. width:198px;
  484. margin-top:-5px;
  485. }
  486.  
  487. #under a {
  488. display:block;
  489. font-size:10px;
  490. font-style:italic;
  491. text-align:right;
  492. margin-top:3px;
  493. color:{color:sidelink};
  494. font-family: 'Ruluko', sans-serif;
  495. border-bottom:1px solid {color:sidelinkborder};
  496. border-right:7px solid {color:sidelinkborder};
  497. padding:3px 8px 3px 0px;
  498. }
  499.  
  500. #first a {
  501. padding-top:4px;
  502. }
  503.  
  504. #under a:hover {
  505. padding-right:30px;
  506. color:{color:sidelinkhover};
  507. border-bottom:1px solid {color:sidelinkborderhover};
  508. border-right:7px solid {color:sidelinkborderhover};
  509. letter-spacing:5px;
  510. }
  511.  
  512. #pagination {
  513. position:absolute;
  514. bottom:2px;
  515. right:0px;
  516. z-index:999;
  517. }
  518.  
  519. #pagination a{
  520. font-size:19px;
  521. font-family:baskerville;
  522. color:{color:sidelink};
  523. }
  524.  
  525. #pagination a:hover {
  526. color:{color:sidelinkhover};
  527. }
  528.  
  529. #movers {
  530. position:absolute;
  531. margin-top:-21px;
  532. width:60px;
  533. z-index:777;
  534. {block:IfNotFixedTopbar}
  535. right:15px;
  536. {/block:IfNotFixedTopbar}
  537. {block:IfFixedTopbar}
  538. right:10px;
  539. {/block:IfFixedTopbar}
  540. }
  541.  
  542. #spacer {
  543. font-size:11px;
  544. color:{color:pagination};
  545. height:10px;
  546. text-align:left;
  547. font-family: 'Ruluko', sans-serif;
  548. margin-left:10px;
  549. font-style:italic;
  550. }
  551.  
  552. #pointy {
  553. font-size:11px;
  554. text-align:right;
  555. font-style:italic;
  556. color:{color:pagination};
  557. margin-top:10px;
  558. padding-right:12px;
  559. padding-left:20px;
  560. font-family: 'Ruluko', sans-serif;
  561. padding-top:7px;
  562. border-top:1px solid {color:topbarborder};
  563. }
  564.  
  565. #info {
  566. font-size:9px;
  567. text-align:center;
  568. border-top:1px solid {color:text};
  569. font-family: 'Ruluko', sans-serif;
  570. margin-top:7px;
  571. padding-top:5px;
  572. font-style:italic;
  573. }
  574.  
  575. #info a{
  576. color:{color:infolink};
  577. }
  578.  
  579. #info a:hover {
  580. color:{color:infolinkhover};
  581. }
  582.  
  583. #tags {
  584. font-size:9px;
  585. text-align:left;
  586. margin-top:5px;
  587. background-color:{color:tagsbackground};
  588. padding:5px;
  589. text-transform:none;
  590. font-family: 'Ruluko', sans-serif;
  591. }
  592.  
  593. #tags a {
  594. color:{color:tags};
  595. }
  596.  
  597. #tags a:hover {
  598. color:{color:tagshover};
  599. }
  600.  
  601. #credit {
  602. position:fixed;
  603. bottom:5px;
  604. right:5px;
  605. padding:3px 10px 0px 5px;
  606. font-size:12px;
  607. color:{color:sidelink};
  608. border:1px solid {color:sidelinkborder};
  609. font-family: 'Allura', cursive;
  610. -webkit-transition: all 0.3s ease-out;
  611. -o-transition: all 0.3s ease-out;
  612. -webkit-transition: all 0.3s ease-out;
  613. -moz-transition: all 0.3s ease-out;
  614.  
  615. }
  616.  
  617. #credit:hover {
  618. bottom:3px;
  619. right:3px;
  620. color:{color:sidelinkhover};
  621. border:3px double {color:sidelinkborderhover};
  622. -webkit-transition: all 0.3s ease-out;
  623. -o-transition: all 0.3s ease-out;
  624. -webkit-transition: all 0.3s ease-out;
  625. -moz-transition: all 0.3s ease-out;
  626. }
  627.  
  628.  
  629. .quote {
  630. padding-left:50px;
  631. padding-right:50px;
  632. font-size:12px;
  633. line-height:110%;
  634. text-align:center;
  635. font-family: 'Droid Sans', sans-serif;
  636. }
  637.  
  638. .portrait {
  639. float:left;
  640. padding-right:5px;
  641. }
  642.  
  643. #asker {
  644. margin-top:6px;
  645. font-size:15px;
  646. padding-bottom:4px;
  647. font-family: 'Amatic SC', cursive;
  648. letter-spacing:2px;
  649. }
  650.  
  651. #question {
  652. margin-top:-3px;
  653. border-bottom:1px solid {color:text};
  654. padding-bottom:10px;
  655. }
  656.  
  657. .audio {
  658. margin-right:5px;
  659. width:70px;
  660. float:left;
  661. }
  662.  
  663. .hidden {
  664. width:70px;
  665. height:73px;
  666. }
  667.  
  668. .pull {
  669. margin-left:4px;
  670. margin-top:-6px;
  671. }
  672.  
  673. .tumblr_audio_player {
  674. margin:0px;
  675. padding:0px;
  676. width:500px;
  677. height:50px;
  678. }
  679.  
  680. .player {
  681. width:35px;
  682. height:37px;
  683. margin-left:10px;
  684. margin-top:10px;
  685. background-color:#999;
  686. overflow:hidden;
  687. position:absolute;
  688. opacity:0.7;
  689. background-color:#fff;
  690. border:7px solid #ECECEC;
  691. -webkit-transition: all 0.3s ease-out;
  692. -o-transition: all 0.3s ease-out;
  693. -webkit-transition: all 0.3s ease-out;
  694. -moz-transition: all 0.3s ease-out;
  695. }
  696.  
  697. .player:hover {
  698. opacity:1;
  699. -webkit-transition: all 0.3s ease-out;
  700. -o-transition: all 0.3s ease-out;
  701. -webkit-transition: all 0.3s ease-out;
  702. -moz-transition: all 0.3s ease-out;
  703. }
  704.  
  705. .caption {
  706. margin-top:20px;
  707. }
  708.  
  709. .audio img{
  710. max-width: 70px;
  711. height: auto;
  712. }
  713.  
  714. .song {
  715. margin-left:70px;
  716. margin-top:-55px;
  717. text-transform:uppercase;
  718. font-size:10px;
  719. padding-bottom:13px;
  720. font-family: 'Droid Sans', sans-serif;
  721. }
  722.  
  723. ol.notes {
  724. padding:0px;
  725. margin-left:10px;
  726. list-style-type:decimal;
  727. font-style:italic;
  728. border-bottom: solid 1px {color:borders};
  729. }
  730.  
  731. ol.notes li.note {
  732. border-top: solid 1px {color:borders};
  733. padding: 10px;
  734. font-family: 'Droid Sans', sans-serif;
  735. }
  736.  
  737. ol.notes li.note img.avatar {
  738. vertical-align: -4px;
  739. margin-right: 10px;
  740. width: 16px;
  741. height: 16px;
  742. }
  743.  
  744. ol.notes li.note blockquote {
  745. border-color: {color:text};
  746. padding: 4px 10px;
  747. margin: 10px 0px 0px 25px;
  748. }
  749.  
  750. ol.notes li.note blockquote a {
  751. text-decoration: none;
  752. }
  753.  
  754.  
  755. {CustomCSS}</style></head><body>
  756.  
  757. <div id="outer">
  758.  
  759. {block:IfNotFixedTopbar}
  760. <div id="over">
  761. {Title}
  762. </div>
  763. {/block:IfNotFixedTopbar}
  764.  
  765. <div id="links">
  766.  
  767. {block:IfLink1Name}
  768.  
  769. <div class="duo">
  770. <div class="swirl">
  771. <a href="{text:link1}"></a>
  772. </div>
  773. <div class="appear">
  774. <a href="{text:link1}">{text:link1name}</a>
  775. </div>
  776. </div>
  777.  
  778. {/block:IfLink1Name}
  779.  
  780.  
  781. {block:IfLink2Name}
  782.  
  783. <div class="duo">
  784. <div class="swirl">
  785. <a href="{text:link2}"></a>
  786. </div>
  787. <div class="appear">
  788. <a href="{text:link2}">{text:link2name}</a>
  789. </div>
  790. </div>
  791.  
  792. {/block:IfLink2Name}
  793.  
  794.  
  795. {block:IfLink3Name}
  796.  
  797. <div class="duo">
  798. <div class="swirl">
  799. <a href="{text:link3}"></a>
  800. </div>
  801. <div class="appear">
  802. <a href="{text:link3}">{text:link3name}</a>
  803. </div>
  804. </div>
  805.  
  806. {/block:IfLink3Name}
  807. {block:IfLink4Name}
  808.  
  809. <div class="duo">
  810. <div class="swirl">
  811. <a href="{text:link4}"></a>
  812. </div>
  813. <div class="appear">
  814. <a href="{text:link4}">{text:link4name}</a>
  815. </div>
  816. </div>
  817.  
  818. {/block:IfLink4Name}
  819. {block:IfLink5Name}
  820.  
  821. <div class="duo">
  822. <div class="swirl">
  823. <a href="{text:link5}"></a>
  824. </div>
  825. <div class="appear">
  826. <a href="{text:link5}">{text:link5name}</a>
  827. </div>
  828. </div>
  829.  
  830. {/block:IfLink5Name}
  831.  
  832. {block:IfLink6Name}
  833.  
  834. <div class="duo">
  835. <div class="swirl">
  836. <a href="{text:link6}"></a>
  837. </div>
  838. <div class="appear">
  839. <a href="{text:link6}">{text:link6name}</a>
  840. </div>
  841. </div>
  842.  
  843. {/block:IfLink6Name}
  844.  
  845. </div>
  846.  
  847. <div id="sidebarimage">
  848. <img src="{image:sidebar}">
  849. </div>
  850.  
  851. {block:IfFixedTopbar}
  852. <div id="over">
  853. {Title}
  854. </div>
  855. {/block:IfFixedTopbar}
  856.  
  857. <div id="under">
  858. <div id="first"><a href="/">home</a></div>
  859. <a href="/ask">askbox</a>
  860. {block:IfLink7Name}
  861. <a href="{text:link7}">{text:link7name}</a>
  862. {/block:IfLink7Name}
  863. {block:IfLink8Name}
  864. <a href="{text:link8}">{text:link8name}</a>
  865. {/block:IfLink8Name}
  866. </div>
  867.  
  868. <div id="description">
  869. {Description}
  870. </div>
  871.  
  872.  
  873. </div>
  874.  
  875. <div id="sidebar">
  876.  
  877. <div id="title">
  878. {text:quote}
  879. </div>
  880.  
  881. <div id="pagination">
  882. {block:JumpPagination length="8"}
  883. {block:JumpPage}
  884. <a title="page {PageNumber}" href="{URL}">&bull;</a>&nbsp;
  885. {/block:JumpPage}
  886. {/block:JumpPagination}
  887. </div>
  888.  
  889. <div id="floaters">
  890.  
  891. {block:Pagination}
  892.  
  893. <div id="movers">
  894.  
  895. <div id="spacer">
  896. {block:PreviousPage}
  897. <a href="{PreviousPage}">prev</a>
  898. {/block:PreviousPage}
  899. </div>
  900.  
  901. <div id="pointy">
  902. {block:NextPage}
  903. <a href="{NextPage}">next</a>
  904. {/block:NextPage}
  905. </div>
  906.  
  907. </div>
  908.  
  909. {/block:Pagination}
  910. </div>
  911.  
  912.  
  913. </div>
  914.  
  915. <a target="blank" href="http://colorfulmetaphors.tumblr.com"><div id="credit">T</div></a>
  916.  
  917. <div id="entries">
  918. {block:Posts}
  919. <div id="post">
  920.  
  921. {block:Text}
  922. {block:Title}
  923. <h1>{Title}</h1>
  924. {/block:Title}
  925. {Body}
  926. {/block:Text}
  927.  
  928. {block:Photo}
  929. <center>{LinkOpenTag}
  930. {block:IfNot400pxPosts}
  931. {block:IfNot500pxPosts}
  932. <img src="{PhotoURL-250}">
  933. {/block:IfNot500pxPosts}
  934. {/block:IfNot400pxPosts}
  935.  
  936. {block:If500pxPosts}
  937. <img src="{PhotoURL-500}">
  938. {/block:If500pxPosts}
  939.  
  940. {block:If400pxPosts}
  941. <img src="{PhotoUrl-500}" width="400">
  942. {/block:If400pxPosts}
  943. {LinkCloseTag}</center>
  944. {block:Caption}
  945. {Caption}
  946. {/block:Caption}
  947. {/block:Photo}
  948.  
  949. {block:Photoset}
  950. {block:IfNot400pxPosts}
  951. {block:IfNot500pxPosts}
  952. {Photoset-250}
  953. {/block:IfNot500pxPosts}
  954. {/block:IfNot400pxPosts}
  955.  
  956. {block:If500pxPosts}
  957. {Photoset-500}
  958. {/block:If500pxPosts}
  959.  
  960. {block:If400pxPosts}
  961. {Photoset-400}
  962. {/block:If400pxPosts}
  963. {block:Caption}
  964. {Caption}
  965. {/block:Caption}
  966. {/block:Photoset}
  967.  
  968. {block:Quote}
  969. <div class="quote">
  970. {Quote}
  971. </div>
  972. {block:Source}
  973. <div style="text-align:center; font-family: 'Droid Sans', sans-serif;">— {Source} —
  974. </div>
  975. {/block:Source}
  976. {/block:Quote}
  977.  
  978. {block:Link}
  979. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  980. {block:Description}
  981. {Description}
  982. {/block:Description}
  983. {/block:Link}
  984.  
  985. {block:Chat}
  986. {block:Title}
  987. <h1>{Title}</h1>
  988. {/block:Title}
  989. {block:Lines}
  990. {block:Label}
  991. <strong>{Label}&nbsp;</strong>
  992. {/block:Label}
  993. {Line}<br />
  994. {/block:Lines}
  995. {/block:Chat}
  996.  
  997. {block:Audio}
  998. {block:AlbumArt}
  999. <div class="audio">
  1000. <div class="pull">
  1001. <img src="{AlbumArtURL}">
  1002. </div>
  1003. </div>
  1004. {/block:AlbumArt}
  1005. <div class="hidden">
  1006. <div class="player">
  1007. {AudioPlayerWhite}
  1008. </div>
  1009. </div>
  1010. <div class="song">
  1011. {block:TrackName}
  1012. {TrackName}
  1013. {/block:TrackName}
  1014. {block:Artist}
  1015. <br />{Artist}
  1016. {/block:Artist}
  1017. <br />{PlayCountWithLabel}
  1018. </div>
  1019. {block:Caption}
  1020. <div class="caption">
  1021. {Caption}
  1022. </div>
  1023. {/block:Caption}
  1024. {/block:Audio}
  1025.  
  1026. {block:Video}
  1027. {block:IfNot500pxPosts}
  1028. {block:IfNot400pxPosts}
  1029. {Video-250}
  1030. {/block:IfNot400pxPosts}
  1031. {/block:IfNot500pxPosts}
  1032.  
  1033. {block:If500pxPosts}
  1034. {Video-500}
  1035. {/block:If500pxPosts}
  1036.  
  1037. {block:If400pxPosts}
  1038. {Video-400}
  1039. {/block:If400pxPosts}
  1040. {block:Caption}
  1041. {Caption}
  1042. {/block:Caption}
  1043. {/block:Video}
  1044.  
  1045. {block:Answer}
  1046. <div class="portrait">
  1047. <img src="{AskerPortraitURL-48}">
  1048. </div>
  1049. <div id="asker">
  1050. {Asker}
  1051. </div>
  1052. <br />
  1053. <div id="question">
  1054. {Question}
  1055. </div>
  1056. <br />
  1057. {Answer}
  1058. {/block:Answer}
  1059.  
  1060.  
  1061. <div id="info">
  1062. {block:Date}
  1063. <a href="{Permalink}">
  1064. {TimeAgo}&nbsp;&nbsp;|&nbsp;&nbsp;
  1065. {/block:Date}
  1066. {NoteCountWithLabel}
  1067. </a>
  1068. {block:RebloggedFrom}
  1069. &nbsp;&nbsp;|&nbsp;&nbsp;
  1070. {block:ContentSource}
  1071. <a title="{ReblogRootName}" href="{SourceURL}">source</a>
  1072. &nbsp;&nbsp;:&nbsp;&nbsp;
  1073. {/block:ContentSource}
  1074. <a title="{ReblogParentName}" href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  1075. &nbsp;&nbsp;|&nbsp;&nbsp;
  1076. <a href="{ReblogURL}">reblog</a>
  1077.  
  1078. </div>
  1079.  
  1080. {block:HasTags}
  1081. <div id="tags">
  1082. {block:Tags}&nbsp;&nbsp;<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;
  1083. {/block:Tags}
  1084. </div>
  1085. {/block:HasTags}
  1086.  
  1087. </div>
  1088.  
  1089. <br /><br /><br /><br /><br /><br />
  1090. {block:PostNotes}
  1091. {PostNotes}
  1092. {/block:PostNotes}
  1093. {/block:Posts}</div>
  1094.  
  1095. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment