Advertisement
mogimochi

Theme [01] Inquisitive

Jul 7th, 2012
21,828
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.76 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!-----------------------------------------------------------------------
  6.  
  7. Theme 01 Inquisitive
  8. by yukoki/s-ekki
  9.  
  10. 1. Light/Heavy CSS editting is allowed.
  11. 2. Do not use as base code.
  12. 3. Do not remove credit.
  13. 4. Do not claim theme as your own.
  14. 5. Do not redistribute.
  15.  
  16. ++ [YUKOKI 2012 THEMES' REVAMPS] ++ [YUKOKI REVAMP PACK #01] ++
  17. This theme is unlikely to be further edited or updated, & its preview will also be moved to a static page. It's similar to being labeled as an 'old theme'. This theme's first title was 'Madness'.
  18.  
  19. ---------------------------------------------------------- VER 200116 -->
  20.  
  21. <meta name="color:background" content="#f1f0f0">
  22. <meta name="color:sidebar or content bg" content="#ffffff">
  23.  
  24. <meta name="color:blog title" content="#9e9e9e">
  25. <meta name="color:desc text" content="#a8a8a8">
  26. <meta name="color:desc bold" content="#ffc577">
  27. <meta name="color:desc italic" content="#7dfc6d">
  28. <meta name="color:desc links" content="#6cd4f7">
  29. <meta name="color:desc links hover" content="#e9e7e7">
  30.  
  31. <meta name="color:pagination links" content="#ffffff">
  32. <meta name="color:pagination text" content="#777676">
  33. <meta name="color:pagination bg" content="#c9c6c6">
  34. <meta name="color:pagination bg hover" content="#000000">
  35. <meta name="color:pagination links hover" content="#ffffff">
  36.  
  37. <meta name="color:navigation bg" content="#f1e6c6">
  38. <meta name="color:navigation text" content="#000000">
  39. <meta name="color:navigation bg hover" content="#ffffff">
  40. <meta name="color:navigation text hover" content="#e2e2e2">
  41.  
  42. <meta name="color:link 1" content="#a8a8a8">
  43. <meta name="color:link 1 hover" content="#89a4b4">
  44. <meta name="color:link 2" content="#ffc11b">
  45. <meta name="color:link 2 hover" content="#fcdd8d">
  46. <meta name="color:link 3" content="#c5effa">
  47. <meta name="color:link 3 hover" content="#abcfd8">
  48. <meta name="color:link 4" content="#deff00">
  49. <meta name="color:link 4 hover" content="#c7e402">
  50. <meta name="color:link 5" content="#91f7cf">
  51. <meta name="color:link 5 hover" content="#6fc0a0">
  52. <meta name="color:link 6" content="#fbfd05">
  53. <meta name="color:link 6 hover" content="#fdfdc6">
  54.  
  55. <meta name="color:post background" content="#f8f8f8">
  56.  
  57. <meta name="color:body text" content="#686767">
  58. <meta name="color:body bold" content="#b6e49e">
  59. <meta name="color:body italic" content="#ffd079">
  60. <meta name="color:body links" content="#b0d4d8">
  61. <meta name="color:body links hover" content="#fffdfd">
  62. <meta name="color:body links hover bg" content="#b2c7cc">
  63. <meta name="color:blockquote" content="#959596">
  64.  
  65. <meta name="color:post title border" content="#ffd8a3">
  66. <meta name="color:post title text" content="#8a8787">
  67. <meta name="color:post title border hover" content="#e4fc8b">
  68. <meta name="color:post title text hover" content="#000000">
  69. <meta name="color:post title hover bg" content="#fffdfd">
  70.  
  71. <meta name="color:ask background" content="#ffffff">
  72. <meta name="color:ask text" content="#7e7d7d">
  73. <meta name="color:asker text" content="#000000">
  74. <meta name="color:asker link" content="#305d91">
  75. <meta name="color:asker link hover" content="#dfdddd">
  76.  
  77. <meta name="color:permalink bg" content="#ebe9e7">
  78. <meta name="color:permalink text" content="#adacac">
  79. <meta name="color:permalink links" content="#90c7fc">
  80. <meta name="color:permalink links hover" content="#b6b5b5">
  81.  
  82. <meta name="color:tags" content="#cfcfcf">
  83. <meta name="color:tags hover" content="#b0e0fc">
  84. <meta name="color:perma page text" content="#757575">
  85.  
  86. <meta name="color:chat even name" content="#00bfff" />
  87. <meta name="color:chat even background" content="#e9e9e9" />
  88. <meta name="color:chat even text" content="#b8b8b8" />
  89. <meta name="color:chat odd name" content="#6eff00" />
  90. <meta name="color:chat odd background" content="#ffffff" />
  91. <meta name="color:chat odd text" content="#919191" />
  92.  
  93. <meta name="image:sidebar" content="">
  94. <meta name="image:background" content="">
  95.  
  96. <meta name="text:billy music player code" content="" />
  97. <meta name="text:Link 1 URL" content="" />
  98. <meta name="text:Link 2 URL" content="" />
  99. <meta name="text:Link 3 URL" content="" />
  100. <meta name="text:Link 4 URL" content="" />
  101. <meta name="text:Link 5 URL" content="" />
  102. <meta name="text:Link 6 URL" content="" />
  103.  
  104. <meta name="if:big posts" content="1" />
  105. <meta name="if:med posts" content="0" />
  106. <meta name="if:2 columns" content="0" />
  107. <meta name="if:monochrome posts" content="0" />
  108. <meta name="if:sb image style 2" content="0" />
  109. <meta name="if:music player" content="0" />
  110. <meta name="if:white audio player" content="1" />
  111. <meta name="if:rounded sidebar" content="1" />
  112. <meta name="if:tumblr controls at top left" content="0" />
  113. <meta name="if:fading photos" content="1" />
  114. <meta name="if:show captions" content="1" />
  115.  
  116. <title>{title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  117. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  118. <link rel="shortcut icon" href="{Favicon}" />
  119.  
  120. <link href='https://fonts.googleapis.com/css?family=Anaheim' rel='stylesheet' type='text/css'>
  121.  
  122. <style type="text/css">
  123.  
  124. .tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop { z-index:999999999!important; }
  125.  
  126. body {
  127. background-color: {color:background};
  128. background-image: url({image:background});
  129. background-attachment: fixed;
  130. margin: 0;
  131. word-wrap: break-word;
  132. }
  133. a { text-decoration:none; }
  134.  
  135. #sidebar {
  136. position: fixed;
  137. z-index: 10000;
  138. top: 50px;
  139. width: 180px;
  140. height: auto;
  141. padding: 20px 10px 20px 10px;
  142. background-color: {color:sidebar or content bg};
  143. {block:ifroundedsidebar}
  144. border-radius: 10px 0 0 10px;
  145. -moz-border-radius: 10px 0 0 10px;
  146. -webkit-border-radius: 10px 0 0 10px;
  147. -o-border-radius: 10px 0 0 10px;
  148. {/block:ifroundedsidebar}
  149. {block:ifbigposts}right: 570px;{/block:ifbigposts}
  150. {block:ifmedposts}right: 470px;{/block:ifmedposts}
  151. {block:if2columns}right: 610px;{/block:if2columns}
  152. {block:permalinkpage}
  153. {block:ifmedposts}right: 570px;{/block:ifmedposts}
  154. {block:if2columns}right: 570px;{/block:if2columns}
  155. {/block:permalinkpage}
  156. }
  157.  
  158. .title {
  159. font-family: anaheim;
  160. font-size: 18px;
  161. text-align: center;
  162. color: {color:blog title};
  163. padding: 0 10px 10px 10px;
  164. }
  165.  
  166. .sbpic {
  167. width:160px;
  168. height: 160px;
  169. padding: 10px;
  170. border-radius: 100px;
  171. }
  172.  
  173. .sbpicp1 {
  174. padding: 10px;
  175. width:160px;
  176. height: 160px;
  177. border-radius: 150px 0 150px 0;
  178. position: absolute;
  179. }
  180. .sbpicp2 {
  181. padding: 10px;
  182. width:160px;
  183. height: 160px;
  184. border-radius: 0 150px 0 150px;
  185. }
  186.  
  187. .desc {
  188. font-family: calibri;
  189. font-size: 11px;
  190. color: {color:desc text};
  191. padding: 0 10px 10px 10px;
  192. text-align: justify;
  193. }
  194. .desc b,strong {color:{color:desc bold};font-weight:400;}
  195. .desc i,em {color:{color:desc italic};}
  196. .desc a {color:{color:desc links};
  197. -webkit-transition: all 0.4s ease-in-out;
  198. -moz-transition: all 0.4s ease-in-out;
  199. -o-transition: all 0.4s ease-in-out;
  200. -ms-transition: all 0.4s ease-in-out;
  201. transition: all 0.4s ease-in-out;}
  202. .desc a:hover {color:{color:desc links hover};}
  203.  
  204. #navigate {
  205. position: fixed;
  206. margin-left: -70px;
  207. margin-top: 20px;
  208. }
  209.  
  210. #navigate a {
  211. background-color: {color:navigation bg};
  212. color: {color:navigation text};
  213. display: block;
  214. width: 48px;
  215. height: 15px;
  216. padding: 6px;
  217. font-family: consolas;
  218. font-size: 9px;
  219. text-transform: uppercase;
  220. letter-spacing: 1px;
  221. line-height: 16px;
  222. text-align: center;
  223. margin-bottom: 10px;
  224. -webkit-transition: all 0.4s ease-in-out;
  225. -moz-transition: all 0.4s ease-in-out;
  226. -o-transition: all 0.4s ease-in-out;
  227. -ms-transition: all 0.4s ease-in-out;
  228. transition: all 0.4s ease-in-out;
  229. }
  230.  
  231. #navigate a:hover {
  232. margin-left: -12px;
  233. width: 60px;
  234. text-align: 2px;
  235. letter-spacing: 3px;
  236. background-color: {color:navigation bg hover};
  237. color: {color:navigation text hover};
  238. }
  239.  
  240. #custom {
  241. position: fixed;
  242. width: 180px;
  243. margin-top: 15px;
  244. margin-left: 54px;
  245. }
  246.  
  247. .cl {
  248. width: 5px;
  249. margin: 5px;
  250. border-radius: 0 0 30px 30px;
  251. float: left;
  252. }
  253.  
  254. #yi {height: 100px;background-color: {color:link 1};
  255. -webkit-transition: all 0.4s ease-in-out;
  256. -moz-transition: all 0.4s ease-in-out;
  257. -o-transition: all 0.4s ease-in-out;
  258. -ms-transition: all 0.4s ease-in-out;
  259. transition: all 0.4s ease-in-out;
  260. }
  261. #yi:hover {height: 120px;background-color:{color:link 1 hover};}
  262. #er {height: 70px;background-color: {color:link 2};
  263. -webkit-transition: all 0.4s ease-in-out;
  264. -moz-transition: all 0.4s ease-in-out;
  265. -o-transition: all 0.4s ease-in-out;
  266. -ms-transition: all 0.4s ease-in-out;
  267. transition: all 0.4s ease-in-out;
  268. }
  269. #er:hover {height: 90px;background-color:{color:link 2 hover};}
  270. #san {height: 80px;background-color: {color:link 3};
  271. -webkit-transition: all 0.4s ease-in-out;
  272. -moz-transition: all 0.4s ease-in-out;
  273. -o-transition: all 0.4s ease-in-out;
  274. -ms-transition: all 0.4s ease-in-out;
  275. transition: all 0.4s ease-in-out;
  276. }
  277. #san:hover {height: 100px;background-color:{color:link 3 hover};}
  278. #si {height: 130px;background-color: {color:link 4};
  279. -webkit-transition: all 0.4s ease-in-out;
  280. -moz-transition: all 0.4s ease-in-out;
  281. -o-transition: all 0.4s ease-in-out;
  282. -ms-transition: all 0.4s ease-in-out;
  283. transition: all 0.4s ease-in-out;
  284. }
  285. #si:hover {height: 150px;background-color:{color:link 4 hover};}
  286. #wu {height: 90px;background-color: {color:link 5};
  287. -webkit-transition: all 0.4s ease-in-out;
  288. -moz-transition: all 0.4s ease-in-out;
  289. -o-transition: all 0.4s ease-in-out;
  290. -ms-transition: all 0.4s ease-in-out;
  291. transition: all 0.4s ease-in-out;
  292. }
  293. #wu:hover {height: 110px;background-color:{color:link 5 hover};}
  294. #liu {height: 120px;background-color: {color:link 6};
  295. -webkit-transition: all 0.4s ease-in-out;
  296. -moz-transition: all 0.4s ease-in-out;
  297. -o-transition: all 0.4s ease-in-out;
  298. -ms-transition: all 0.4s ease-in-out;
  299. transition: all 0.4s ease-in-out;
  300. }
  301. #liu:hover {height: 140px;background-color:{color:link 6 hover};}
  302.  
  303. .pagination {
  304. width: 180px;
  305. padding: 0 10px;
  306. text-align: center;
  307. font-family: consolas;
  308. font-size: 12px;
  309. color: {color:pagination text};
  310. }
  311. .pagination a {
  312. background-color: {color:pagination bg};
  313. color: {color:pagination links};
  314. padding: 0 3px;
  315. margin: 0 -2px;
  316. -webkit-transition: all 0.4s ease-in-out;
  317. -moz-transition: all 0.4s ease-in-out;
  318. -o-transition: all 0.4s ease-in-out;
  319. -ms-transition: all 0.4s ease-in-out;
  320. transition: all 0.4s ease-in-out;
  321. }
  322. .pagination a:hover {
  323. background-color: {color:pagination bg hover};
  324. color: {color:pagination links hover};
  325. }
  326.  
  327. #content {
  328. {block:ifbigposts}width: 520px;{/block:ifbigposts}
  329. {block:ifmedposts}width: 420px;{/block:ifmedposts}
  330. {block:if2columns}width: 560px;{/block:if2columns}
  331. {block:permalinkpage}
  332. {block:ifmedposts}width: 520px;{/block:ifmedposts}
  333. {block:if2columns}width: 530px;{/block:if2columns}
  334. {/block:permalinkpage}
  335. margin: 0 10px;
  336. background-color: {color:sidebar or content bg};
  337. padding: 20px;
  338. float: right;
  339. margin-right: 20px;
  340. }
  341.  
  342. .posts {
  343. padding: 10px;
  344. background-color: {color:post background};
  345. margin-bottom: 20px;
  346. {block:ifbigposts}width: 500px;{/block:ifbigposts}
  347. {block:ifmedposts}width: 400px;{/block:ifmedposts}
  348. {block:if2columns}width: 250px;margin: 5px;{/block:if2columns}
  349. {block:indexpage}padding: 10px 10px 0 10px;{/block:indexpage}
  350. {block:permalinkpage}
  351. {block:ifmedposts}width: 500px;{/block:ifmedposts}
  352. {block:if2columns}width: 500px;{/block:if2columns}
  353. {/block:permalinkpage}
  354. }
  355.  
  356. .photo {
  357. {block:iffadingphotos}opacity: 0.8;{/block:iffadingphotos}
  358. {block:ifbigposts}width: 500px;{/block:ifbigposts}
  359. {block:ifmediumposts}width: 400px;{/block:ifmediumposts}
  360. {block:if2columns}width: 250px;{/block:if2columns}
  361. {block:permalinkpage}
  362. {block:ifmedposts}width: 500px;{/block:ifmedposts}
  363. {block:if2columns}width: 500px;{/block:if2columns}
  364. {/block:permalinkpage}
  365. display:block;
  366. {block:IfMonochromePosts}
  367. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  368. filter: gray; /* IE6-9 */
  369. -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
  370. {/block:IfMonochromePosts}
  371. -webkit-transition: all 0.7s linear;
  372. -moz-transition: all 0.7s linear;
  373. -o-transition: all 0.7s linear;
  374. }
  375. .posts:hover .photo {
  376. {block:IfMonochromePosts}
  377. filter: none;
  378. -webkit-filter: grayscale(0%);
  379. {/block:IfMonochromePosts}
  380. {block:iffadingphotos}opacity:1;{/block:iffadingphotos}
  381. }
  382.  
  383. .text {
  384. font-family: calibri;
  385. color: {color:body text};
  386. font-size: 12px;
  387. text-align: justify;
  388. }
  389.  
  390. .text b,strong {color:{color:body bold};font-weight: 400;}
  391. .text i,em {color:{color:body italic};}
  392.  
  393. .text a, .src a {
  394. color: {color:body links};
  395. }
  396.  
  397. .text a:hover, .src a:hover {
  398. padding: 0 5.5px;
  399. color: {color:body links hover};
  400. background-color: {color:body links hover bg};
  401. font-style: italic;
  402. }
  403.  
  404. .text ul { list-style-type: square; }
  405.  
  406. .posts blockquote {
  407. margin: 5px 10px;
  408. border-left: 3px solid {color:blockquote};
  409. padding: 5px 10px;
  410. }
  411.  
  412. .posts img {
  413. {block:ifbigposts}max-width: 500px;{/block:ifbigposts}
  414. {block:ifmedposts}max-width: 400px;{/block:ifmedposts}
  415. {block:if2columns}max-width: 250px;{/block:if2columns}
  416. {block:permalinkpage}
  417. {block:ifmedposts}max-width: 500px;{/block:ifmedposts}
  418. {block:if2columns}max-width: 500px;{/block:if2columns}
  419. {/block:permalinkpage}
  420. }
  421. .posts blockquote img {max-width: 100%;}
  422.  
  423. .quote {
  424. font-family: Anaheim;
  425. font-size: 18px;
  426. text-align: right;
  427. }
  428.  
  429. .src {
  430. font-family: consolas;
  431. font-size: 10px;
  432. text-align: right;
  433. text-transform: uppercase;
  434. }
  435.  
  436. .ltitle, .ptitle {
  437. font-family: anaheim;
  438. font-size: 16px;
  439. border-left: 40px solid {color:post title border};
  440. padding: 0 20px;
  441. color: {color:post title text};
  442. -webkit-transition: all 0.4s ease-in-out;
  443. -moz-transition: all 0.4s ease-in-out;
  444. -o-transition: all 0.4s ease-in-out;
  445. -ms-transition: all 0.4s ease-in-out;
  446. transition: all 0.4s ease-in-out;
  447. }
  448.  
  449. .ltitle:hover, .ptitle:hover {
  450. background-color: {color:post title hover bg};
  451. border-left: 60px solid {color:post title border hover};
  452. color: {color:post title text hover};
  453. }
  454.  
  455. .odd .line {background-color: {color:chat odd background};padding: 10px;color:{color:chat odd text};}
  456. .even .line {background-color: {color:chat even background};padding: 10px;color:{color:chat even text};}
  457. .odd .name {color: {color:chat odd name};padding: 3px 5px;}
  458. .even .name {color: {color:chat even name};padding: 3px 5px;}
  459.  
  460. #album {
  461. width: 150px;
  462. height: 150px;
  463. background-color: #888;
  464. overflow: hidden;
  465. {block:ifnot2columns}position:absolute;{/block:ifnot2columns}
  466. {block:if2columns}width:250px;height:250px;{/block:if2columns}
  467.  
  468. {block:permalinkpage}{block:if2columns}
  469. position:absolute;
  470. width: 150px;
  471. height: 150px;
  472. {/block:if2columns}{/block:permalinkpage}
  473. }
  474. .noalbum {
  475. width: 150px;
  476. height: 150px;
  477. background-color: #888;
  478. z-index: 50;
  479. {block:if2columns}width:250px;height:250px;{/block:if2columns}
  480.  
  481. {block:permalinkpage}{block:if2columns}
  482. width: 150px;
  483. height: 150px;
  484. {/block:if2columns}{/block:permalinkpage}
  485. }
  486. .albumart {
  487. width: 150px;
  488. height: 150px;
  489. z-index: 50;
  490. {block:if2columns}width:250px;height:250px;{/block:if2columns}
  491.  
  492. {block:permalinkpage}{block:if2columns}
  493. width: 150px;
  494. height: 150px;
  495. {/block:if2columns}{/block:permalinkpage}
  496. }
  497.  
  498. #audinfo {
  499. width: 340px;
  500. margin-left: 160px;
  501. min-height: 150px;
  502. {block:if2columns}
  503. position: absolute;
  504. z-index: 10;
  505. width:250px;
  506. margin-left: 0;
  507. margin-top: -200px;
  508. {/block:if2columns}
  509.  
  510. {block:permalinkpage}{block:if2columns}
  511. position: static;
  512. width: 340px;
  513. margin-left: 160px;
  514. margin-top: 0;
  515. min-height: 150px;
  516. {/block:if2columns}{/block:permalinkpage}
  517. }
  518.  
  519. .aud {
  520. {block:ifbigposts}width: 340px;{/block:ifbigposts}
  521. {block:ifmedposts}width: 240px;{/block:ifmedposts}
  522. height: 27px;
  523. {block:ifwhiteaudioplayer}
  524. background-color: #fff;
  525. {/block:ifwhiteaudioplayer}
  526. {block:ifnotwhiteaudioplayer}
  527. background-color: #000;
  528. {/block:ifnotwhiteaudioplayer}
  529. margin-bottom: 5px;
  530. {block:if2columns}opacity: 0.1;{/block:if2columns}
  531.  
  532. {block:permalinkpage}
  533. {block:if2columns}width: 340px;opacity: 1;{/block:if2columns}
  534. {block:ifmedposts}width: 340px;{/block:ifmedposts}
  535. {/block:permalinkpage}
  536. -webkit-transition: all 0.4s ease-in-out;
  537. -moz-transition: all 0.4s ease-in-out;
  538. -o-transition: all 0.4s ease-in-out;
  539. -ms-transition: all 0.4s ease-in-out;
  540. transition: all 0.4s ease-in-out;
  541. }
  542.  
  543. .audline {
  544. {block:ifbigposts}width: 320px;{/block:ifbigposts}
  545. {block:ifmedposts}width: 220px;{/block:ifmedposts}
  546. {block:if2columns}opacity: 0.1;{/block:if2columns}
  547.  
  548. {block:permalinkpage}
  549. {block:if2columns}width: 320px;opacity: 1;{/block:if2columns}
  550. {block:ifmedposts}width: 320px;{/block:ifmedposts}
  551. {/block:permalinkpage}
  552. height: 26px;
  553. margin-bottom: 5px;
  554. background-color: #fff;
  555. padding: 0 10px;
  556. line-height: 27px;
  557. font-family: anaheim, sans-serif;
  558. font-size: 10px;
  559. text-transform: uppercase;
  560. -webkit-transition: all 0.4s ease-in-out;
  561. -moz-transition: all 0.4s ease-in-out;
  562. -o-transition: all 0.4s ease-in-out;
  563. -ms-transition: all 0.4s ease-in-out;
  564. transition: all 0.4s ease-in-out;
  565. }
  566.  
  567. .audline:hover, .aud:hover { opacity: 1; }
  568.  
  569. .askerportrait {
  570. position: absolute;
  571. border: 10px solid {color:ask background};
  572. }
  573. .a {
  574. margin-left: 100px;
  575. background-color: {color:ask background};
  576. min-height: 64px;
  577. padding: 10px;
  578. font-family: calibri,geneva;
  579. font-size: 13px;
  580. color: {color:ask text};
  581. }
  582. .asker {
  583. color: {color:asker text};
  584. font-family: anaheim, sans-serif;
  585. font-size: 10px;
  586. text-transform: uppercase;
  587. }
  588. .asker a {color: {color:asker link};border-bottom: 1px dashed {color:asker link};}
  589. .q {margin-top: 10px;}
  590. .tri {
  591. position: absolute;
  592. font-size: 30px;
  593. margin: 20px 0 0 85px;
  594. color: {color:ask background};
  595. }
  596.  
  597. #permalink {
  598. background-color: {color:permalink bg};
  599. font-family: consolas;
  600. font-size: 10px;
  601. text-transform: uppercase;
  602. color: {color:permalink text};
  603. margin-top: 10px;
  604. margin-left: -10px;
  605. {block:ifbigposts}width: 492px;{/block:ifbigposts}
  606. {block:ifmedposts}width: 392px;{/block:ifmedposts}
  607. {block:if2columns}width: 242px;{/block:if2columns}
  608. {block:permalinkpage}
  609. {block:ifbigposts}width: 492px;{/block:ifbigposts}
  610. {block:ifmedposts}width: 492px;{/block:ifmedposts}
  611. {block:if2columns}width: 492px;{/block:if2columns}
  612. {/block:permalinkpage}
  613. padding: 10px 14px;
  614. text-align: right;
  615. }
  616.  
  617. .pe a {
  618. color: {color:permalink links};
  619. -webkit-transition: all 0.4s ease-in-out;
  620. -moz-transition: all 0.4s ease-in-out;
  621. -o-transition: all 0.4s ease-in-out;
  622. -ms-transition: all 0.4s ease-in-out;
  623. transition: all 0.4s ease-in-out;
  624. }
  625. .pe a:hover {color: {color:permalink links hover};}
  626.  
  627. .tags a:hover, #permapg a:hover {color:{color:tags hover};background-color:{color:tags hover bg};}
  628. .pe a {
  629. color: {color:permalink links};
  630. -webkit-transition: all 0.4s ease-in-out;
  631. -moz-transition: all 0.4s ease-in-out;
  632. -o-transition: all 0.4s ease-in-out;
  633. -ms-transition: all 0.4s ease-in-out;
  634. transition: all 0.4s ease-in-out;
  635. }
  636. .pe a:hover {color: {color:permalink links hover};}
  637.  
  638. .tags {
  639. font-size: 10px;
  640. letter-spacing:1px;}
  641. .tags a, #permapg a {color:{color:tags};
  642. -webkit-transition: all 0.4s ease-in-out;
  643. -moz-transition: all 0.4s ease-in-out;
  644. -o-transition: all 0.4s ease-in-out;
  645. -ms-transition: all 0.4s ease-in-out;
  646. transition: all 0.4s ease-in-out;
  647. }
  648. .tags a:hover, #permapg a:hover {color:{color:tags hover};background-color:{color:tags hover bg};}
  649.  
  650. #permapg {
  651. margin-top: 10px;
  652. font-family: consolas;
  653. text-align: center;
  654. color: {color:perma page text};
  655. font-size: 10px;
  656. letter-spacing: 1px;
  657. text-transform: uppercase;
  658. }
  659.  
  660. #notecontainer {
  661. padding: 10px;
  662. text-decoration: none;
  663. width: 500px;
  664. }
  665. ol.notes {
  666. list-style-type: none;
  667. letter-spacing: -1px;
  668. font-size: 11px;
  669. color: {color:body};
  670. font-family: consolas;
  671. text-decoration: none;
  672. margin: 0;
  673. width: 500px;
  674. padding: 5px;
  675. text-align: left;
  676. }
  677. ol.notes a {color: {color:body links};
  678. -webkit-transition: all 0.4s ease-in-out;
  679. -moz-transition: all 0.4s ease-in-out;
  680. -o-transition: all 0.4s ease-in-out;
  681. -ms-transition: all 0.4s ease-in-out;
  682. transition: all 0.4s ease-in-out;}
  683. ol.notes a:hover {color: {color:body links hover};}
  684. img.avatar {
  685. margin-right: 5px;
  686. width: 10px;
  687. height: 10px;
  688. float: left;
  689. }
  690.  
  691. #music {
  692. position: fixed;
  693. width: 20px;
  694. height: 20px;
  695. margin-left: -50px;
  696. margin-top: 210px;
  697. overflow: hidden;
  698. background-color: #fff;
  699. -webkit-transition: all 0.4s ease-in-out;
  700. -moz-transition: all 0.4s ease-in-out;
  701. -o-transition: all 0.4s ease-in-out;
  702. -ms-transition: all 0.4s ease-in-out;
  703. transition: all 0.4s ease-in-out;
  704. }
  705.  
  706. .player {margin-left:-20px;margin-top: -6px;}
  707.  
  708. .musicgif {
  709. position: fixed;
  710. margin: 0 5px;
  711. background-color: #fff;
  712. -webkit-transition: all 0.4s ease-in-out;
  713. -moz-transition: all 0.4s ease-in-out;
  714. -o-transition: all 0.4s ease-in-out;
  715. -ms-transition: all 0.4s ease-in-out;
  716. transition: all 0.4s ease-in-out;
  717. }
  718. #music:hover .musicgif {opacity: 0;margin-left: -20px;}
  719.  
  720. #warning {
  721. position: fixed;
  722. width: 100%;
  723. height:100%;
  724. background-color: #fff;
  725. z-index:-1000000;
  726. top:0;
  727. left: 0;
  728. text-align: center;
  729. padding-top: 250px;
  730. font-family: anaheim;
  731. font-size: 20px;
  732. opacity: 0;
  733. {block:ifbigposts}
  734. {block:ifmedposts}opacity:1;z-index:1000000;{/block:ifmedposts}
  735. {block:if2columns}opacity:1;z-index:1000000;{/block:if2columns}
  736. {block:ifmedposts}{block:if2columns}
  737. opacity:1;z-index:1000000;
  738. {/block:if2columns}{/block:ifmedposts}
  739. {/block:ifbigposts}
  740. {block:ifnotbigposts}{block:ifnotmedposts}{block:ifnot2columns}
  741. opacity:1;z-index:1000000;
  742. {/block:ifnot2columns}{/block:ifnotmedposts}{/block:ifnotbigposts}
  743. {block:ifmedposts}{block:if2columns}
  744. opacity:1;z-index:1000000;
  745. {/block:if2columns}{/block:ifmedposts}
  746. }
  747.  
  748.  
  749. {CustomCSS}
  750.  
  751. </style>
  752.  
  753. {block:indexpage}
  754. {block:if2columns}
  755. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  756.  
  757. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  758. <script type="text/javascript">
  759. $(window).load(function () {
  760. $('#content').masonry({
  761. itemSelector : ".posts",
  762. },
  763. function() { $('#content').masonry({ appendedContent: $(this) }); }
  764. );
  765. });
  766. </script>
  767. {/block:if2columns}
  768. {/block:indexpage}
  769.  
  770. </head>
  771. <body>
  772.  
  773. <div id="warning">Please pick 1 post size.</div>
  774.  
  775. <div id="sidebar">
  776.  
  777. {block:ifmusicplayer}
  778. <div id="music">
  779. <div class="musicgif"><img style="width:10px;height:10px;"src="http://media.tumblr.com/tumblr_m7vzruAunT1r6o8v2.gif"></div>
  780. <div class="player">
  781.  
  782. {text:billy music player code}
  783.  
  784. </div></div><!--music-->
  785. {/block:ifmusicplayer}
  786.  
  787. <div class="title">{title}</div>
  788.  
  789. <div id="navigate">
  790. <a href="/">home</a>
  791. <a href="/ask">ask</a>
  792. <a href="/archive">archive</a>
  793. <a href="http://yukoki.tumblr.com">theme</a>
  794. </div><!--navigate-->
  795.  
  796. {block:ifnotsbimagestyle2}
  797. <img class="sbpic" src="{image:sidebar}">
  798. {/block:ifnotsbimagestyle2}
  799. {block:ifsbimagestyle2}
  800. <img class="sbpicp1" src="{image:sidebar}">
  801. <img class="sbpicp2" src="{image:sidebar}">
  802. {/block:ifsbimagestyle2}
  803.  
  804. <div class="desc">{description}</div>
  805.  
  806. {block:Pagination}<div class="pagination">
  807. {block:PreviousPage}
  808. <a href="{PreviousPage}">←</a>
  809. {/block:PreviousPage}
  810. {block:JumpPagination length="5"}
  811. {block:CurrentPage}
  812. <span class="current_page">{PageNumber}</span>
  813. {/block:CurrentPage}
  814. {block:JumpPage}
  815. <a class="jump_page" href="{URL}">{PageNumber}</a>
  816. {/block:JumpPage}
  817. {/block:JumpPagination}
  818. {block:NextPage}
  819. <a href="{NextPage}">→</a>
  820. {/block:NextPage}
  821. </div><!--pagination-->{/block:Pagination}
  822.  
  823. <div id="custom"><center>
  824.  
  825. {block:iflink1url}<a href="{text:link 1 URL}">
  826. <div id="yi" class="cl"></div></a>{/block:iflink1url}
  827. {block:iflink2url}<a href="{text:link 2 URL}">
  828. <div id="er" class="cl"></div></a>{/block:iflink2url}
  829. {block:iflink3url}<a href="{text:link 3 URL}">
  830. <div id="san" class="cl"></div></a>{/block:iflink3url}
  831. {block:iflink4url}<a href="{text:link 4 URL}">
  832. <div id="si" class="cl"></div></a>{/block:iflink4url}
  833. {block:iflink5url}<a href="{text:link 5 URL}">
  834. <div id="wu" class="cl"></div></a>{/block:iflink5url}
  835. {block:iflink6url}<a href="{text:link 6 URL}">
  836. <div id="liu" class="cl"></div></a>{/block:iflink6url}
  837.  
  838. </center></div><!--custom-->
  839.  
  840. </div><!--sidebar-->
  841.  
  842.  
  843. <div id="content">{block:posts}
  844. <div class="posts">
  845.  
  846. {block:Quote}
  847. <div class="quote">"{Quote}"</div>
  848. <div class="src">- {Source}</div>
  849. {/block:Quote}
  850.  
  851. {block:Photo}
  852. {LinkOpenTag}
  853. <div class="photo"><img src="{PhotoURL-500}"></div>
  854. {LinkCloseTag}
  855. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  856. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  857. <div class="text">{Caption}</div>
  858. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  859. {/block:Photo}
  860.  
  861. {block:Photoset}
  862. <div class="photo">
  863. {block:ifbigposts}{Photoset-500}{/block:ifbigposts}
  864. {block:ifmedposts}{Photoset-400}{/block:ifmedposts}
  865. {block:if2columns}{Photoset-250}{/block:if2columns}
  866. </div>
  867. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  868. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  869. <div class="text">{Caption}</div>
  870. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  871. {/block:Photoset}
  872.  
  873. {block:Link}
  874. <a href="{URL}"><div class="ltitle">{Name} →</div></a>
  875. {block:Description}
  876. <div class="text">{description}</div>
  877. {/block:Description}
  878. {/block:Link}
  879.  
  880. {block:Chat}
  881. {block:Title}<div class="title">{Title}</div>{/block:Title}
  882. <div class="text">
  883. {block:Lines}<div class="{Alt}">
  884. <div class="line">{block:Label}<span class="name">{Label}</span>{/block:Label} {Line}<br /></div></div>
  885. {/block:Lines}
  886. </div>
  887. {/block:Chat}
  888.  
  889. {block:Audio}
  890. <div id="album"><div class="noart"></div>{block:AlbumArt}<img class="albumart" src="{AlbumArtURL}">{/block:AlbumArt}</div>
  891.  
  892. <div id="audinfo">
  893. <div class="aud">{block:ifwhiteaudioplayer}{AudioPlayerWhite}{/block:ifwhiteaudioplayer}{block:ifnotwhiteaudioplayer}{AudioPlayerBlack}{/block:ifnotwhiteaudioplayer}</div>
  894. {block:TrackName}<div class="audline">Track: {TrackName}</div>{/block:TrackName}
  895. {block:Album}<div class="audline">Album: {Album}</div>{/block:Album}
  896. {block:Artist}<div class="audline">Artist: {Artist}</div>{/block:Artist}
  897. <div class="audline">{PlayCountWithLabel}</div>
  898. </div><!--audinfo-->
  899. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  900. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  901. <div class="text">{Caption}</div>
  902. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  903. {/block:Audio}
  904.  
  905. {block:Text}
  906. {block:title}<div class="ptitle">{title}</div>{/block:title}
  907. <div class="text">{body}</div>
  908. {/block:Text}
  909.  
  910. {block:Answer}
  911. <img class="askerportrait" src="{AskerPortraitURL-64}">
  912. <div class="tri">◀</div>
  913. <div class="a">
  914. <span class="asker">{Asker}:</span>
  915. <div class="q">{Question}</div>
  916. </div>
  917. <div class="text">{Answer}</div>
  918. {/block:Answer}
  919.  
  920. {block:Video}
  921. {block:ifbigposts}{Video-500}{/block:ifbigposts}
  922. {block:ifmedposts}{Video-400}{/block:ifmedposts}
  923. {block:if2columns}{Video-250}{/block:if2columns}
  924. {block:caption}<div class="text">{caption}</div>{/block:caption}
  925. {/block:Video}
  926.  
  927. {block:indexpage}
  928. <div id="permalink">
  929. {block:date}<div class="pe">Posted <a href="{Permalink}">{timeago}</a>, with <a href="{Permalink}">{NoteCountWithLabel}</a>{block:RebloggedFrom} // ori: <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}</div><!--pe-->{/block:date}
  930. {block:ifnot2columns}
  931. {block:HasTags}<div class="tags">
  932. filed under: {block:tags}<a href="{tagurl}">#{tag}</a> {/block:tags}
  933. </div>{/block:HasTags}
  934. {/block:ifnot2columns}
  935. </div><!--permalink-->
  936. {/block:indexpage}
  937.  
  938. {block:permalinkpage}{block:date}
  939.  
  940. <div id="permapg">
  941. Posted on {DayOfMonthWithZero} {Month} {Year}, at {12Hour}.{Minutes}{AmPm} with {NoteCountWithLabel}<br>
  942. {block:RebloggedFrom}reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>, originally by <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  943. {block:HasTags}<div class="tags">
  944. filed under: {block:tags}<a href="{tagurl}">#{tag}</a> {/block:tags}
  945. </div>{/block:HasTags}
  946. </div><!--permapg-->
  947.  
  948. {block:PostNotes}
  949. <div id="notecontainer">{PostNotes}</div>
  950. {/block:PostNotes}
  951.  
  952. {/block:date}{/block:permalinkpage}
  953.  
  954. </div><!--posts-->{/block:posts}
  955.  
  956. {block:ContentSource}
  957. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  958. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  959. {/block:SourceLogo}
  960. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  961. {/block:ContentSource}
  962.  
  963. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  964.  
  965. </div><!--content-->
  966.  
  967. </body>
  968. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement