farflunghopes

new teeth

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