Advertisement
bittersveet

the one made on 25th

Jun 25th, 2015
264
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.83 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!---- ᴘʟᴇᴀsᴇ ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛ!
  5. ᴛʜᴇᴍᴇ ʙʏ ɢᴀʟᴀxɪᴀs-ᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  6. ʙᴀsᴇ ʙʏ ᴀɴᴢᴇʟɪᴄ.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ ---->
  7.  
  8. <meta name="color:Background Color" content="#181818"/>
  9.  
  10. <meta name="color:Blockquote Border" content="#5e5e5e"/>
  11. <meta name="color:Odd Text" content="#dbd7df"/>
  12. <meta name="color:Odd Background" content="#181818"/>
  13. <meta name="color:Even Text" content="#6f6f6f"/>
  14. <meta name="color:Even Background" content="#181818"/>
  15.  
  16. <meta name="color:Bolded Text" content="#8b8b8b"/>
  17. <meta name="color:Italicised Text" content="#8b8b8b"/>
  18.  
  19. <meta name="color:Post Text" content="#6f6f6f"/>
  20. <meta name="color:Post Background" content="#151515"/>
  21. <meta name="color:Desc Text" content="#6f6f6f"/>
  22. <meta name="color:Asker Text" content="#6f6f6f"/>
  23. <meta name="color:Asker Hover" content="#ffffff"/>
  24. <meta name="color:Ask Background" content="#181818"/>
  25. <meta name="color:Ask Border" content="#ffffff"/>
  26. <meta name="color:Track Text" content="#6b6b6b"/>
  27. <meta name="color:Track Background" content="#181818"/>
  28. <meta name="color:Tooltip Background" content="#151515"/>
  29. <meta name="color:Tooltip Text" content="#929292"/>
  30. <meta name="color:Tooltip Border" content="#8644c9"/>
  31.  
  32. <meta name="color:Permalink Text Color" content="#ffffff"/>
  33. <meta name="color:Permalink Link" content="#8644c9"/>
  34.  
  35. <meta name="color:Links" content="#8644c9"/>
  36. <meta name="color:Hover Link" content="#ffffff"/>
  37.  
  38. <meta name="text:Link1" content="Link1"/>
  39. <meta name="text:Url1" content="/"/>
  40. <meta name="text:Link2" content="Link2"/>
  41. <meta name="text:Url2" content="/"/>
  42. <meta name="text:Link3" content="Link3"/>
  43. <meta name="text:Url3" content="/"/>
  44. <meta name="text:Link4" content="Link4"/>
  45. <meta name="text:Url4" content="/"/>
  46. <meta name="text:Link5" content="Link5"/>
  47. <meta name="text:Url5" content="/"/>
  48. <meta name="text:Link6" content="Link6"/>
  49. <meta name="text:Url6" content="/"/>
  50. <meta name="text:Url4" content="/"/>
  51.  
  52. <meta name="color:Selected Text" content="#8644c9"/>
  53. <meta name="color:Scrollbar Background" content="#151515"/>
  54. <meta name="color:Scrollbar Trackbar" content="#8644c9"/>
  55.  
  56. <meta name="image:Background Image" content=""/>
  57. <meta name="image:Sidebar Image" content="http://static.tumblr.com/ssbhuug/HkXn566ka/28586_default_2.png"/>
  58. <meta name="image:Sidebar Image2" content="http://static.tumblr.com/ssbhuug/eqYn566l6/28586_default_3.png"/>
  59.  
  60. <meta name="if:ShowCaptions" content="1"/>
  61. <meta name="if:Monochrome" content="1">
  62.  
  63.  
  64. <meta name="if:250" content="1">
  65. <meta name="if:400" content="0">
  66. <meta name="if:500" content="0">
  67.  
  68. <head>
  69.  
  70. <title>{Title}</title>
  71. {block:Description}
  72. <meta name="description" content="{MetaDescription}" />
  73. {/block:Description}
  74. <link rel="shortcut icon" href="{Favicon}" />
  75. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  76.  
  77. <style type="text/css">
  78.  
  79. @font-face { font-family:"the only exception"; src: url('https://dl.dropboxusercontent.com/s/sscilc1215lrv5n/theonlyexception.ttf'); format(“truetype”);}
  80.  
  81. *, body, a {cursor: url(http://i.imgur.com/2qleX.jpg), auto;}
  82.  
  83. a:hover {cursor: url(http://i.imgur.com/IepP2.jpg), auto;}
  84.  
  85. ::selection {color: {color:Selected Text};}
  86. ::-moz-selection {color: {color:Selected Text};}
  87.  
  88.  
  89. /* THEME SPECIALS */
  90. ::-webkit-scrollbar-thumb:vertical {
  91. background-color: {color:Scrollbar Trackbar};
  92. height: 50px;
  93. }
  94.  
  95. ::-webkit-scrollbar {
  96. height: 10px;
  97. width: 5px;
  98. background-color: {color:Scrollbar Background};
  99. }
  100.  
  101. /* BODY */
  102. body {
  103. background-image:url({image:background image});
  104. background-repeat:repeat;
  105. background-attachment: fixed;
  106. background-color: {color:background color};
  107. background-position: bottom right;
  108. margin: 0;
  109. }
  110.  
  111. a:link, a:visited, a:active {
  112. text-decoration: none;
  113. color: {color:Links};
  114. -moz-transition:all ease-in-out 0.7s;
  115. -webkit-transition:all ease-in-out 0.7s;
  116. -o-transition:all ease-in-out 0.7s;
  117. transition:all ease-in-out 0.7s;
  118. }
  119.  
  120. a:hover {
  121. color: {color:hover link};
  122. }
  123.  
  124. b, strong {
  125. color: {color:bolded text};
  126. }
  127.  
  128. i, em {
  129. color: {color:italicised text};
  130. }
  131.  
  132. small, sub {
  133. font-family:trebuchet ms;
  134. font-size:9px;
  135. letter-spacing: 1;
  136. line-height: 100%;
  137. margin-top: 10px !important;
  138. line-height: 90%;
  139. }
  140.  
  141. pre {
  142. width:100%;
  143. font-family: arial;
  144. font-size: 8px;
  145. text-align:center;
  146. text-transform: uppercase;
  147. white-space:pre-wrap;
  148. word-wrap:break-word;
  149. padding:3px;
  150. }
  151.  
  152. code {
  153. font-family: arial;
  154. font-size: 8px;
  155. text-transform: uppercase;
  156. letter-spacing: 1;
  157. line-height: 100%;
  158. }
  159.  
  160. blockquote {
  161. margin-left:5px;
  162. width:90%;
  163. padding-left:5px;
  164. border-left: solid 3px {color:Blockquote Border};
  165. overflow:hidden;
  166. }
  167.  
  168. blockquote blockquote {
  169. margin-left: 10px;
  170. width: 85%;
  171. text-align: justify;
  172. border-left: solid 1px {color:Blockquote Border};
  173. padding: 5px;
  174. overflow:hidden;
  175. }
  176.  
  177. blockquote img {
  178. {block:if250}max-width:210px !important;{/block:if250}
  179. {block:if400}max-width:330px !important;{/block:if400}
  180. {block:if500}max-width:420px !important;{/block:if500}
  181. opacity: .5;
  182. overflow:hidden;
  183. }
  184.  
  185. blockquote blockquote img {
  186. {block:if250}max-width:180px !important;{/block:if250}
  187. {block:if400}max-width:285px !important;{/block:if400}
  188. {block:if500}max-width:355px !important;{/block:if500}
  189. opacity: .5;
  190. overflow:hidden;
  191. }
  192.  
  193. .alignment {
  194. position: relative;
  195. margin-left: 150px;
  196. margin-top: 10px;
  197. height: 100%;
  198. height: auto !important;
  199. min-height: 100%;
  200. {block:if250}width:250px;{/block:if250}
  201. {block:if400}width:400px;{/block:if400}
  202. {block:if500}width:500px;{/block:if500}
  203. }
  204.  
  205. /* QUOTES */
  206.  
  207. #quote {
  208. color: {color:bolded text};
  209. font-family:trebuchet ms;
  210. font-size:11px;
  211. font-style:italic;
  212. }
  213.  
  214. #quotation {
  215. position:relative;
  216. font-size:50px;
  217. color: #F78181;
  218. opacity:0.3;
  219. font-family: 'arial';
  220. margin-top: 15px; }
  221.  
  222. #source {
  223. font-family:calibri;
  224. font-size:8px;
  225. letter-spacing:0px;
  226. text-align:right;
  227. text-transform:uppercase;
  228. }
  229.  
  230. /* CONTENT WRAPPER */
  231.  
  232. #wrapper {
  233. width:270px;
  234. height:auto;
  235. margin-left:-70px;
  236. margin-right:auto;
  237. margin-top:40px;
  238. margin-bottom:40px;
  239. position:relative;
  240. }
  241.  
  242. /* SB WRAPPER */
  243.  
  244. #sbwrapper {
  245. width: 500px;
  246. margin: 0 auto;
  247. {block:if250}margin-left:950px;{/block:if250}
  248. {block:if400}margin-left:1100px;{/block:if400}
  249. {block:if500}margin-left:1200px;{/block:if500}
  250. bottom:545px;
  251. position:fixed;
  252. }
  253.  
  254. /* BLOG POSTS */
  255.  
  256. .posts {
  257. {block:if250}width:250px;{/block:if250}
  258. {block:if400}width:400px;{/block:if400}
  259. {block:if500}width:500px;{/block:if500}
  260. font-family:calibri;
  261. font-size:10px;
  262. letter-spacing: 1;
  263. line-height: 100%;
  264. color: {color:post text};
  265. text-align: justify;
  266. word-wrap:break-word;
  267. background-color: {color:post background};
  268. padding: 10px;
  269. margin-bottom: 20px;
  270. -webkit-border-radius: 0px 0px 0px 0px;
  271. -moz-border-radius: 10px 10px 0px 0px;
  272. -border-radius: 10px 10px 0px 0px;
  273. -moz-transition:all ease-in-out 0.7s;
  274. -webkit-transition:all ease-in-out 0.7s;
  275. -o-transition:all ease-in-out 0.7s;
  276. transition:all ease-in-out 0.7s;
  277. }
  278.  
  279. .postinfo {
  280. {block:if250}width:250px;{/block:if250}
  281. {block:if400}width:400px;{/block:if400}
  282. {block:if500}width:500px;{/block:if500}
  283. font-family:trebuchet ms;
  284. font-size:9px;
  285. letter-spacing: 1;
  286. line-height: 100%;
  287. color: {color:post text};
  288. text-align: justify;
  289. word-wrap:break-word;
  290. margin-top: -15px;
  291. background-color: {color:post background};
  292. padding: 10px;
  293. -moz-transition:all ease-in-out 0.7s;
  294. -webkit-transition:all ease-in-out 0.7s;
  295. -o-transition:all ease-in-out 0.7s;
  296. transition:all ease-in-out 0.7s;
  297. }
  298.  
  299. .postcontainer img:hover, #photoset:hover {
  300. -moz-transition:all ease-in-out 0.7s;
  301. -webkit-transition:all ease-in-out 0.7s;
  302. -o-transition:all ease-in-out 0.7s;
  303. transition:all ease-in-out 0.7s;
  304. -webkit-filter: grayscale(0%) !important;
  305. opacity: 1;
  306. }
  307.  
  308. .postcontainer img, #photoset {
  309. {block:if250}max-width:250px;{/block:if250}
  310. {block:if400}max-width:400px;{/block:if400}
  311. {block:if500}max-width:500px;{/block:if500}
  312. {block:ifMonochrome}-webkit-filter: grayscale(100%);
  313. {/block:ifMonochrome}
  314. opacity: .5;
  315. -moz-transition:all ease-in-out 0.7s;
  316. -webkit-transition:all ease-in-out 0.7s;
  317. -o-transition:all ease-in-out 0.7s;
  318. transition:all ease-in-out 0.7s;
  319. }
  320.  
  321. .photopost img {
  322. {block:if250}max-width: 250px !important; {/block:if250}
  323. {block:if400}max-width: 400px !important; {/block:if400}
  324. {block:if500}max-width: 500px !important; {/block:if500}
  325. opacity: .5;
  326. {block:ifMonochrome}-webkit-filter: grayscale(100%);
  327. {/block:ifMonochrome}
  328. -moz-transition:all ease-in-out 0.7s;
  329. -webkit-transition:all ease-in-out 0.7s;
  330. -o-transition:all ease-in-out 0.7s;
  331. transition:all ease-in-out 0.7s;
  332. }
  333.  
  334. .photopost img:hover {
  335. opacity: 1;
  336. {block:ifMonochrome}-webkit-filter: grayscale(0%);
  337. {/block:ifMonochrome}
  338. -moz-transition:all ease-in-out 0.7s;
  339. -webkit-transition:all ease-in-out 0.7s;
  340. -o-transition:all ease-in-out 0.7s;
  341. transition:all ease-in-out 0.7s;
  342. }
  343.  
  344. .posts img, #photoset {
  345. {block:if250}max-width: 240px !important; {/block:if250}
  346. {block:if400}max-width: 390px !important; {/block:if400}
  347. {block:if500}max-width: 490px !important; {/block:if500}
  348. opacity: .5;
  349. {block:ifMonochrome}-webkit-filter: grayscale(100%);
  350. {/block:ifMonochrome}
  351. -moz-transition:all ease-in-out 0.7s;
  352. -webkit-transition:all ease-in-out 0.7s;
  353. -o-transition:all ease-in-out 0.7s;
  354. transition:all ease-in-out 0.7s;
  355. }
  356.  
  357. .posts img:hover {
  358. opacity: 1;
  359. {block:ifMonochrome}-webkit-filter: grayscale(0%);
  360. {/block:ifMonochrome}
  361. -moz-transition:all ease-in-out 0.7s;
  362. -webkit-transition:all ease-in-out 0.7s;
  363. -o-transition:all ease-in-out 0.7s;
  364. transition:all ease-in-out 0.7s;
  365. }
  366.  
  367. .video {
  368. {block:if250}max-width: 250px !important; {/block:if250}
  369. {block:if400}max-width: 400px !important; {/block:if400}
  370. {block:if500}max-width: 500px !important; {/block:if500}
  371. opacity: .5;
  372. {block:ifMonochrome}-webkit-filter: grayscale(100%);
  373. {/block:ifMonochrome}
  374. -moz-transition:all ease-in-out 0.7s;
  375. -webkit-transition:all ease-in-out 0.7s;
  376. -o-transition:all ease-in-out 0.7s;
  377. transition:all ease-in-out 0.7s;
  378. }
  379.  
  380. .video:hover {
  381. opacity: 1;
  382. {block:ifMonochrome}-webkit-filter: grayscale(0%);
  383. {/block:ifMonochrome}
  384. -moz-transition:all ease-in-out 0.7s;
  385. -webkit-transition:all ease-in-out 0.7s;
  386. -o-transition:all ease-in-out 0.7s;
  387. transition:all ease-in-out 0.7s;
  388. }
  389.  
  390. .postnotes {
  391. {block:if250}width:250px;{/block:if250}
  392. {block:if400}width:400px;{/block:if400}
  393. {block:if500}width:500px;{/block:if500}
  394. font-family: calibri;
  395. font-size: 8px;
  396. letter-spacing: 1;
  397. line-height: 100%;
  398. color: {color:post text};
  399. text-align: left;
  400. text-transform: uppercase;
  401. word-wrap:break-word;
  402. background-color: {color:post background};
  403. padding: 10px;
  404. -moz-transition:all ease-in-out 0.7s;
  405. -webkit-transition:all ease-in-out 0.7s;
  406. -o-transition:all ease-in-out 0.7s;
  407. transition:all ease-in-out 0.7s;
  408. }
  409.  
  410. .postnotes img {
  411. display:none;
  412.  
  413. }
  414.  
  415. .postperma {
  416. {block:if250}width:260px;{/block:if250}
  417. {block:if400}width:410px;{/block:if400}
  418. {block:if500}width:510px;{/block:if500}
  419. margin-top: -18px;
  420. margin-bottom: 20px;
  421. font-family: calibri;
  422. font-size: 8px;
  423. color: {color:Permalink Text Color};
  424. text-transform: uppercase;
  425. text-align:center;
  426. line-height:100%;
  427. letter-spacing:0px;
  428. background-color: {color:post background};
  429. padding:5px;
  430. height: 9px;
  431. -webkit-border-radius: 0px 0px 10px 10px;
  432. -moz-border-radius: 0px 0px 10px 10px;
  433. -border-radius: 0px 0px 10px 10px;
  434. -moz-transition:all ease-in-out 0.7s;
  435. -webkit-transition:all ease-in-out 0.7s;
  436. -o-transition:all ease-in-out 0.7s;
  437. transition:all ease-in-out 0.7s;
  438.  
  439. }
  440.  
  441. .postperma a {
  442. color: {color:permalink link};
  443. -moz-transition:all ease-in-out 0.7s;
  444. -webkit-transition:all ease-in-out 0.7s;
  445. -o-transition:all ease-in-out 0.7s;
  446. transition:all ease-in-out 0.7s;
  447.  
  448. }
  449.  
  450. .postperma a:hover {
  451. color: {color:hover link};
  452. -moz-transition:all ease-in-out 0.7s;
  453. -webkit-transition:all ease-in-out 0.7s;
  454. -o-transition:all ease-in-out 0.7s;
  455. transition:all ease-in-out 0.7s;
  456.  
  457. }
  458.  
  459. #posttitle {
  460. font-family:tahoma;
  461. font-size:16px;
  462. letter-spacing:0px;
  463. line-height:15px;
  464. font-weight:bold;
  465. text-align:left;
  466. }
  467.  
  468. #permtitle {
  469. font-family: calibri;
  470. color: {color:desc text};
  471. font-size: 10px;
  472. padding: 5px;
  473. margin-top: 5px;
  474. text-align: center;
  475. text-transform: uppercase;
  476. }
  477.  
  478. #odd {
  479. padding:2px;
  480. font-family:trebuchet ms;
  481. font-size:9px;
  482. color:{color:Odd Text};
  483. background-color: {color:Odd Background};
  484. }
  485.  
  486. #even {
  487. padding:2px;
  488. font-family:trebuchet ms;
  489. font-size:9px;
  490. color:{color:Even Text};
  491. background-color: {color:Even Background};
  492. }
  493.  
  494. #tags {
  495. font-family: calibri;
  496. font-size: 9px;
  497. text-transform: uppercase;
  498. letter-spacing: 1;
  499. line-height: 100%;
  500. }
  501.  
  502. /* AUDIO */
  503.  
  504. .album {
  505. background-repeat: no-repeat;
  506. background-position: center;
  507. position: absolute;
  508. width: 86px;
  509. height: 86px;
  510. background-size: 60px;
  511. overflow: hidden;
  512. background-color: {color:Track Background};
  513. }
  514.  
  515. .album img {
  516. width: 86px;
  517. height: 86px;
  518. overflow: hidden;
  519. }
  520.  
  521. .player {
  522. width: 10px;
  523. height: 11px;
  524. overflow: hidden;
  525. padding: 4px 21px 21px 4px;
  526. margin-top: 27px;
  527. margin-left: 26px;
  528. position: absolute;
  529. background-color: #fff;
  530. opacity: 0.5;
  531. z-index: 10;
  532. -webkit-transition: all 0.4s linear;
  533. -moz-transition: all 0.4s linear;
  534. -o-transition: all 0.4s linear;
  535. -moz-border-radius: 30px;
  536. -webkit-border-radius: 30px;
  537. border-radius: 30px;
  538. }
  539.  
  540. .album:hover .player {
  541. opacity: 0.9;
  542. }
  543.  
  544. .track {
  545. margin-left: 90px;
  546. min-height: 80px;
  547. max-height: 100px;
  548. overflow: auto;
  549. font-family:calibri;
  550. font-size: 10px;
  551. padding: 3px;
  552. color: {color:Track Text};
  553. text-transform: uppercase;
  554. letter-spacing: 1px;
  555. background: {color:Track Background};
  556. }
  557.  
  558. /* QUESTION */
  559.  
  560. #ask {
  561. {block:if250}max-width:250px;{/block:if250}
  562. {block:if400}max-width:400px;{/block:if400}
  563. {block:if500}max-width:500px;{/block:if500}
  564. background-color: {color:Ask Background};
  565. }
  566.  
  567. .as {
  568. min-height: auto;
  569. padding: 13px;
  570. background-color: {color:Ask Background};
  571. }
  572.  
  573. .aske {
  574. margin-top:5px;
  575. font-family:the only exception;
  576. font-size:12px;
  577. line-height:13px;
  578. text-align:right;
  579. text-transform:lowercase;
  580. color: #FFFFFF;
  581. background-color: #1C1C1C;
  582. -moz-transition:all ease-in-out 0.7s;
  583. -webkit-transition:all ease-in-out 0.7s;
  584. -o-transition:all ease-in-out 0.7s;
  585. transition:all ease-in-out 0.7s;
  586. }
  587.  
  588. .aske:hover {
  589. -moz-transition:all ease-in-out 0.7s;
  590. -webkit-transition:all ease-in-out 0.7s;
  591. -o-transition:all ease-in-out 0.7s;
  592. transition:all ease-in-out 0.7s;
  593. }
  594.  
  595. .que {
  596. font-family: calibri;
  597. font-size: 10px;
  598. border-bottom: dashed 1px {color:Ask Border};
  599. text-transform:uppercase;
  600. color: {color:ask text};
  601. }
  602.  
  603. .ans {
  604. font-family:trebuchet ms;
  605. font-size:9px;
  606. color: {color:ask text};
  607. }
  608.  
  609. /* Hover Title Style */
  610.  
  611. #s-m-t-tooltip{
  612. max-width:250px;
  613. margin-top:25px;
  614. margin-left:15px;
  615. padding-left:4px;
  616. padding-right:4px;
  617. z-index:9999999;
  618. background-color: {color:Tooltip Background};
  619. color: {color:Tooltip Text};
  620. border-radius:15px 0px 0px 15px;
  621. font-family:calibri;
  622. font-size:10px;
  623. letter-spacing:0px;
  624. text-transform:uppercase;
  625. text-align:center;
  626. line-height:14px;
  627. border-left: 3px solid {color:Tooltip Border};
  628. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  629. }
  630.  
  631.  
  632. /* DESCRIPTION */
  633.  
  634. .desc {
  635. position: fixed;
  636. overflow:auto;
  637. margin-top: -100px;
  638. margin-left: -166px;
  639. padding:3px;
  640. width:180px;
  641. height:auto;
  642. border-top:5px solid #FFFFFF;
  643. font-family: calibri;
  644. font-size: 10px;
  645. word-spacing:0px;
  646. color: #FFFFFF;
  647. text-transform: uppercase;
  648. letter-spacing: 0px;
  649. text-align: justify;
  650. background: #1C1C1C;
  651. }
  652.  
  653. .desc::-webkit-scrollbar-thumb:vertical {
  654. background-color: {color:Scrollbar Trackbar};
  655. height: 50px;
  656. }
  657.  
  658. .desc::-webkit-scrollbar {
  659. height: 10px;
  660. width: 2px;
  661. background-color: {color:Scrollbar Background};
  662.  
  663. }
  664.  
  665. /* DESCRIPTION2 */
  666.  
  667. .desc2 {
  668. position: fixed;
  669. overflow:auto;
  670. margin-top: 45px;
  671. margin-left: -166px;
  672. padding:3px;
  673. width:60px;
  674. height:13px;
  675. font-family: calibri;
  676. font-size: 10px;
  677. word-spacing:0px;
  678. color: #FFFFFF;
  679. text-transform: uppercase;
  680. letter-spacing: 0px;
  681. text-align: center;
  682. background: #1C1C1C;
  683. }
  684.  
  685. .desc2::-webkit-scrollbar-thumb:vertical {
  686. background-color: {color:Scrollbar Trackbar};
  687. height: 50px;
  688. }
  689.  
  690. .desc2::-webkit-scrollbar {
  691. height: 10px;
  692. width: 2px;
  693. background-color: {color:Scrollbar Background};
  694.  
  695. }
  696.  
  697. /* IMAGE */
  698.  
  699.  
  700. #sidepic {
  701. position:fixed;
  702. margin-top: 64px;
  703. margin-left: -170px;
  704. width:300px;
  705. height:300px;
  706. padding:5px;
  707. background: transparent;
  708. }
  709.  
  710.  
  711. #sidepic img {
  712. width:66px;
  713. height:20px;
  714. {block:ifMonochrome}-webkit-filter: grayscale(.9);
  715. {/block:ifMonochrome}
  716. -webkit-transition: all 0.7s ease-in-out;
  717. -moz-transition: all 0.7s ease-in-out;
  718. -o-transition: all 0.7s ease-in-out;
  719. -ms-transition: all 0.7s ease-in-out;
  720. transition: all 0.7s ease-in-out;
  721. }
  722.  
  723. #sidepic img:hover {
  724. {block:ifMonochrome}-webkit-filter: grayscale(.1);
  725. {/block:ifMonochrome}
  726. -webkit-transition: all 0.7s ease-in-out;
  727. -moz-transition: all 0.7s ease-in-out;
  728. -o-transition: all 0.7s ease-in-out;
  729. -ms-transition: all 0.7s ease-in-out;
  730. transition: all 0.7s ease-in-out;
  731. }
  732.  
  733. #sidepic2 {
  734. position:fixed;
  735. margin-top: -186px;
  736. margin-left: -378px;
  737. width:200px;
  738. height:500px;
  739. padding:5px;
  740. background: transparent;
  741. }
  742.  
  743. #sidepic2 img {
  744. width:200px;
  745. height:500px;
  746. {block:ifMonochrome}-webkit-filter: grayscale(.9);
  747. {/block:ifMonochrome}
  748. -webkit-transition: all 0.7s ease-in-out;
  749. -moz-transition: all 0.7s ease-in-out;
  750. -o-transition: all 0.7s ease-in-out;
  751. -ms-transition: all 0.7s ease-in-out;
  752. transition: all 0.7s ease-in-out;
  753. }
  754.  
  755. #sidepic2 img:hover {
  756. {block:ifMonochrome}-webkit-filter: grayscale(.1);
  757. {/block:ifMonochrome}
  758. -webkit-transition: all 0.7s ease-in-out;
  759. -moz-transition: all 0.7s ease-in-out;
  760. -o-transition: all 0.7s ease-in-out;
  761. -ms-transition: all 0.7s ease-in-out;
  762. transition: all 0.7s ease-in-out;
  763. }
  764.  
  765.  
  766. .naviz {
  767. position:absolute;
  768. margin-top: 45px;
  769. margin-left: -95px;
  770. }
  771.  
  772. .naviz a {
  773. display: inline-block;
  774. width: 34px;
  775. height: 17px;
  776. border:1px solid #1C1C1C;
  777. background: #1C1C1C;
  778. -webkit-transition: all 0.7s ease-in-out;
  779. -moz-transition: all 0.7s ease-in-out;
  780. -o-transition: all 0.7s ease-in-out;
  781. -ms-transition: all 0.7s ease-in-out;
  782. transition: all 0.7s ease-in-out;
  783. }
  784.  
  785. .naviz a:hover {
  786. -webkit-transition: all 0.7s ease-in-out;
  787. -moz-transition: all 0.7s ease-in-out;
  788. -o-transition: all 0.7s ease-in-out;
  789. -ms-transition: all 0.7s ease-in-out;
  790. transition: all 0.7s ease-in-out;
  791. }
  792.  
  793.  
  794.  
  795.  
  796. /* BORDERS */
  797.  
  798. .border1 {
  799. position:fixed;
  800. left:0px;
  801. top:0px;
  802. width:50px;
  803. height:100%;
  804. background: {color:post background};
  805. border-right:5px double {color:background color};
  806. }
  807.  
  808. .border2 {
  809. {block:if250}left:375px;{/block:if250}
  810. {block:if400}left:525px;{/block:if400}
  811. {block:if500}left:625px;{/block:if500}
  812. position:fixed;
  813. top:0px;
  814. width:50px;
  815. height:100%;
  816. background: {color:post background};
  817. border-left:5px double {color:background color};
  818. }
  819.  
  820.  
  821.  
  822. </style>
  823. <style type="text/css">{CustomCSS}</style>
  824.  
  825. <script type="text/javascript" src="http://static.tumblr.com/twte3d7/RhUlio0y7/lazyload.js"></script>
  826. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  827.  
  828.  
  829. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  830. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  831. <script>
  832. (function($){
  833. $(document).ready(function(){
  834. $("[title],a[title],img[title]").style_my_tooltips({
  835. tip_follows_cursor:true,
  836. tip_delay_time:100,
  837. tip_fade_speed:300,
  838. attribute:"title"
  839. });
  840. });
  841. })(jQuery);
  842. </script>
  843. </head>
  844.  
  845. <body>
  846.  
  847. <div id="wrapper">
  848. <div id="sbwrapper">
  849.  
  850. <div id="sidepic"><img src="{image:Sidebar Image}"/></div>
  851.  
  852. <div id="sidepic2"><img src="{image:Sidebar Image2}"/></div>
  853.  
  854. <div class="desc">
  855. {description}
  856. </div>
  857.  
  858. <div class="desc2">
  859. hovers
  860. </div>
  861.  
  862. <div class="naviz">
  863. <a href="{text:Url1}" title="{text:Link1}"></a>
  864. <a href="{text:Url2}" title="{text:Link2}"></a>
  865. <a href="{text:Url3}" title="{text:Link3}"></a>
  866. <br><a href="{text:Url4}" title="{text:Link4}"></a>
  867. <a href="{text:Url5}" title="{text:Link5}"></a>
  868. <a href="{text:Url6}" title="{text:Link6}"></a>
  869. </div>
  870.  
  871.  
  872. <div class="border1"></div>
  873. <div class="border2"></div>
  874.  
  875.  
  876. </div>
  877.  
  878. <div class="alignment">
  879. <div class="autopagerize_page_element" >
  880.  
  881. {block:Posts}
  882. <div class="posts">
  883.  
  884. {block:ContentSource}
  885. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  886. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  887. {/block:SourceLogo}
  888. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  889.  
  890. <!-- {ReblogParentURL}{block:ReblogParentLogo}<img src="{BlackLogoURL}"
  891. width="{LogoWidth}" height="{LogoHeight}" alt="{ReblogParentTitle}" />
  892. {/block:ReblogParentLogo}
  893. {block:NoReblogParentLogo}{ReblogParentLink}{/block:NoReblogParentLogo} -->
  894. {/block:ContentSource}
  895.  
  896.  
  897. <!-- PHOTO POSTS -->
  898.  
  899. {block:if250}
  900. {block:Photo}
  901. {LinkOpenTag}
  902. <div class="photopost">
  903. <img src="{PhotoURL-250}">
  904. </div>
  905. {LinkCloseTag}
  906. {block:ifShowCaptions}
  907. {block:Caption}
  908. {Caption}
  909. {/block:Caption}
  910. {/block:ifShowCaptions}
  911. {/block:photo}
  912. {/block:if250}
  913.  
  914.  
  915. {block:if400}
  916. {block:Photo}
  917. {LinkOpenTag}
  918. <div class="photopost">
  919. <img src="{PhotoURL-400}">
  920. </div>
  921. {LinkCloseTag}
  922. {block:ifShowCaptions}
  923. {block:Caption}
  924. {Caption}
  925. {/block:Caption}
  926. {/block:ifShowCaptions}
  927. {/block:photo}
  928. {/block:if400}
  929.  
  930. {block:if500}
  931. {block:Photo}
  932. {LinkOpenTag}
  933. <div class="photopost">
  934. <img src="{PhotoURL-500}">
  935. </div>
  936. {LinkCloseTag}
  937. {block:ifShowCaptions}
  938. {block:Caption}
  939. {Caption}
  940. {/block:Caption}
  941. {/block:ifShowCaptions}
  942. {/block:photo}
  943. {/block:if500}
  944.  
  945.  
  946.  
  947. <!-- PHOTOSET POSTS -->
  948. {block:if250}
  949. {block:Photoset}
  950. <div id="photoset">
  951. {Photoset-250}
  952. </div>
  953. {block:ifShowCaptions}
  954. {block:Caption}
  955. {Caption}
  956. {/block:Caption}
  957. {/block:ifShowCaptions}
  958. {/block:Photoset}
  959. {/block:if250}
  960.  
  961. {block:if400}
  962. {block:Photoset}
  963. <div id="photoset">
  964. {Photoset-400}
  965. </div>
  966. {block:ifShowCaptions}
  967. {block:Caption}
  968. {Caption}
  969. {/block:Caption}
  970. {/block:ifShowCaptions}
  971. {/block:Photoset}
  972. {/block:if400}
  973.  
  974. {block:if500}
  975. {block:Photoset}
  976. <div id="photoset">
  977. {Photoset-500}
  978. </div>
  979. {block:ifShowCaptions}
  980. {block:Caption}
  981. {Caption}
  982. {/block:Caption}
  983. {/block:ifShowCaptions}
  984. {/block:Photoset}
  985. {/block:if500}
  986.  
  987.  
  988. <!-- VIDEO POSTS -->
  989. <div class="video">
  990. {block:if250}
  991. {block:Video}
  992. {Video-250}
  993. {block:ifShowCaptions}
  994. {block:Caption}
  995. {Caption}
  996. {/block:Caption}
  997. {/block:ifShowCaptions}
  998. {/block:Video}
  999. {/block:if250}
  1000.  
  1001. {block:if400}
  1002. {block:Video}
  1003. {Video-400}
  1004. {block:ifShowCaptions}
  1005. {block:Caption}
  1006. {Caption}
  1007. {/block:Caption}
  1008. {/block:ifShowCaptions}
  1009. {/block:Video}
  1010. {/block:if400}
  1011.  
  1012. {block:if500}
  1013. {block:Video}
  1014. {Video-500}
  1015. {block:ifShowCaptions}
  1016. {block:Caption}
  1017. {Caption}
  1018. {/block:Caption}
  1019. {/block:ifShowCaptions}
  1020. {/block:Video}
  1021. {/block:if500}
  1022. </div>
  1023.  
  1024. <!-- AUDIO POSTS -->
  1025. {block:Audio}<div class="album">{block:AudioPlayer}<div class="player">{AudioPlayerWhite}</div>{/block:AudioPlayer}
  1026.  
  1027. {block:AlbumArt}{block:IndexPage}<img src="{AlbumArtURL}">{/block:IndexPage}{block:PermalinkPage}<img src="{AlbumArtURL}">{/block:PermalinkPage}{/block:AlbumArt}</div>
  1028.  
  1029. <div class="track">{block:TrackName}Title: {TrackName}<br>{/block:TrackName}{block:Artist}Artist: {Artist}<br>{/block:Artist}{block:Album}Album:
  1030. {Album}{/block:Album}</div>
  1031.  
  1032. {block:ifShowCaptions}{block:Indexpage}{block:Caption}{Caption}{/block:Caption}{/block:Indexpage}{/block:ifShowCaptions}
  1033.  
  1034. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  1035. {/block:Audio}
  1036.  
  1037.  
  1038. <!-- QUOTE POSTS -->
  1039. {block:Quote}
  1040. <div id="quotation">❝</div>
  1041. <div id="quote">{Quote}</div>
  1042. {block:Source}<div id="source">— {Source}</div>{/block:Source}
  1043. {/block:Quote}
  1044.  
  1045.  
  1046. <!-- TEXT POSTS -->
  1047. {block:Text}
  1048. {block:Title}
  1049. <div id="posttitle">{Title}</div>
  1050. {/block:Title}
  1051. {Body}
  1052. {/block:Text}
  1053.  
  1054.  
  1055. <!-- QUESTION POSTS -->
  1056. {block:Answer}
  1057. <div id="ask">
  1058. <div class="as">
  1059. <div class="que">{Question}</div>
  1060. <div class="aske">«incoming» {Asker}</div>
  1061. </div>
  1062. </div>
  1063. <div class="ans">{Answer}</div>
  1064. {/block:Answer}
  1065.  
  1066. <!-- CHAT POSTS -->
  1067. {block:Chat}
  1068. {block:Title}
  1069. <div id="posttitle">{Title}</div><br />
  1070. {/block:Title}
  1071. {block:Lines}<div id="{Alt}">
  1072. {block:Label}<b>{Label}</b>{/block:Label} {Line}</br></div>
  1073. {/block:Lines}
  1074. {/block:Lines}
  1075. {/block:Chat}
  1076.  
  1077. <!-- LINK POSTS -->
  1078. {block:Link}
  1079. <a href="{URL}"> <div id="posttitle">{Name}</div></a>
  1080. {block:Description}
  1081. {Description}
  1082. {/block:Description}
  1083. {/block:Link}
  1084. </div>
  1085.  
  1086. {block:IndexPage}
  1087. <div class="postperma">
  1088. {block:Date}
  1089. <a href="{Permalink}">{TimeAgo}</a>{/block:Date} {block:NoteCount} » <a href="{Permalink}">{NoteCountWithLabel}{/block:NoteCount}</a> » <a href="{ReblogURL}">reblog</a></div>
  1090. {/block:IndexPage}
  1091.  
  1092. {block:PermaLinkPage}
  1093. <div class="postinfo">
  1094. <center>
  1095. <div id="permtitle">Posted on: {Month} {DayofMonth}, {Year}<br> {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}</div>
  1096. {block:RebloggedFrom}
  1097. <div id="tags">Via:
  1098. <a href="{ReblogParentURL}">{ReblogParentName}</a> ||
  1099. Source: <a href="{ReblogRootURL}">{ReblogRootName}</a></div>
  1100. {/block:RebloggedFrom}
  1101. </center>
  1102. <br>
  1103. {block:HasTags}
  1104. <div id="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> &nbsp; {/block:Tags} </div>
  1105. {/block:HasTags}
  1106. </div>
  1107.  
  1108. {block:PostNotes}<div class="postnotes"><div style="margin-left: -20px;">{PostNotes}</div></div>{/block:PostNotes}
  1109. {/block:PermalinkPage}
  1110.  
  1111. {/block:Posts}
  1112.  
  1113. </div>
  1114. </div>
  1115. </div>
  1116. </div>
  1117.  
  1118.  
  1119. <a href="http://galaxias-themes.tumblr.com/" title="credit to galaxias-themes -- tweaked by mun, some icons are mine, others aren't so please do not steal!" style="bottom:5px; left:13px; pading:2px; position:fixed; font-family: calibri; font-size:10px;">THM.</a>
  1120. </body>
  1121. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement