Advertisement
Perfect-Nicholas

Theme #07 - Bloody Thorn

May 7th, 2013
2,649
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 19.48 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. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7. {block:Description}
  8. <meta name="description" content="{MetaDescription}" />
  9. {/block:Description}
  10.  
  11.  
  12. <head>
  13.  
  14. <!----
  15.  
  16. Β© LLERMANS.TUMBLR.COM | "THEME" #007
  17.  
  18. DON'T STEAL, I'LL FIND YOU.
  19. DON'T REMOVE THE CREDIT!
  20.  
  21. ---->
  22.  
  23. <!-- VARIABLES -->
  24.  
  25. <meta name="image:Background" content=""/>
  26. <meta name="image:Sidebar" content="" />
  27.  
  28.  
  29. <meta name="color:Background" content="#ffffff" />
  30. <meta name="color:Text" content="#797979" />
  31. <meta name="color:desctext" content="#797979" />
  32. <meta name="color:Bold" content="#5a8685" />
  33. <meta name="color:Italic" content="#94adac" />
  34. <meta name="color:Link" content="#94adac" />
  35. <meta name="color:Content BG" content="#ffffff" />
  36. <meta name="color:Content Border" content="#ebebeb" />
  37. <meta name="color:linksbg" content="#ffffff" />
  38. <meta name="color:pagination" content="#ffffff" />
  39. <meta name="color:scrollbarbg" content="#94adac"/>
  40.  
  41. <meta name="text:Text Size" content="10px" />
  42. <meta name="text:pagination border" content="0px" />
  43.  
  44. <meta name="text:link1" content="" />
  45. <meta name="text:link1 url" content="/" />
  46. <meta name="text:link2" content="" />
  47. <meta name="text:link2 url" content="/" />
  48. <meta name="text:link3" content="" />
  49. <meta name="text:link3 url" content="/" />
  50. <meta name="text:link4" content="" />
  51. <meta name="text:link4 url" content="/" />
  52.  
  53.  
  54. <style type="text/css">
  55.  
  56. /* --- SCROLLBAR ---*/
  57.  
  58. ::-webkit-scrollbar {
  59. width: 5px;height: 5px;
  60. }
  61. ::-webkit-scrollbar-button:start:decrement,
  62. ::-webkit-scrollbar-button:end:increment {
  63. height: 6px;display: block;background-color: {color:white};
  64. }
  65. ::-webkit-scrollbar-track-piece {
  66. background-color: {color:scrollbarbg};
  67. }
  68. ::-webkit-scrollbar-thumb:vertical {
  69. height: 9px;background-color: {color:scrollbarbg};border-top:1px solid {color:scrollbarbg};border-bottom:1px solid {color:scrollbarbg};
  70. }
  71.  
  72. /* MAIN */
  73.  
  74. body {
  75. background-color:{color:Background};
  76. background-image: url('{image:Background}');
  77. color:{color:Text};
  78. font-family: calibri;
  79. font-size: {text:Text Size};
  80. padding: 1px;}
  81.  
  82. a:link, a:active {
  83. text-decoration:none;
  84. color: {color:Link}; }
  85.  
  86. a:visited {
  87. text-decoration:none;
  88. color: {color:Link}; }
  89.  
  90. a:hover {
  91. text-decoration:none;
  92. color: {color:Bold};}
  93.  
  94. b, strong, .strong {color:{color:Bold};}
  95.  
  96. blockquote {
  97. border-left:2px solid {color:Text};
  98. padding-left:6px; }
  99.  
  100. #tumblr_controls{ position:fixed!important; right: 0px; top:0px;}
  101.  
  102. i, em, .em {color:{color:Italic};}
  103.  
  104.  
  105. /* CONTENT */
  106.  
  107. .contentwhole {
  108. width:520px;
  109. z-index:0;
  110. margin-left:500px;
  111. height:100%;}
  112.  
  113. .content {
  114. width: 500px;
  115. z-index:0;
  116. height: auto;
  117. padding:10px;
  118. margin-top:40px;
  119. background-color: {color:Content BG};
  120. border:0px solid {color:Content Border};}
  121.  
  122. .info {
  123. height:15px;
  124. float:center;
  125. padding-top:4px;
  126. margin-top:10px;
  127. opacity:0.8;
  128. text-align:center;
  129. font-size:7px;
  130. font-family:arial;
  131. letter-spacing:1px;
  132. background-color: {color:Info BG};
  133. background-image:url('{image:Info BG}');
  134. color:{color:Link};
  135. border-top: 1px solid {color:Info Border};
  136. width: 500px;
  137. text-transform:uppercase;
  138. transition-duration: 0.6s;
  139. -moz-transition-duration: 0.6s;
  140. -webkit-transition-duration: 0.6s;
  141. -o-transition-duration: 0.6s; }
  142.  
  143. .info a {
  144. font-size:7px; }
  145.  
  146. .info:hover {
  147. opacity:1.0;
  148. transition-duration: 0.6s;
  149. -moz-transition-duration: 0.6s;
  150. -webkit-transition-duration: 0.6s;
  151. -o-transition-duration: 0.6s; }
  152.  
  153.  
  154. /* SIDEBAR */
  155.  
  156. .hover {
  157. width:430px;
  158. height:500px;
  159. top:50px;
  160. position:fixed; }
  161.  
  162.  
  163. .portrait {
  164. width:48px;
  165. height:48px;
  166. border:3px solid {color:Background};
  167. float:left;
  168. margin:2px;}
  169.  
  170. .sidebarcontent {
  171. width:372px;
  172. text-align:center;
  173. padding:20px 20px 20px 20px;
  174. top:10px;
  175. left:10px;
  176. height:270px;
  177. position:absolute;
  178. background-color:#FFFFFF;
  179. opacity:0.0;
  180. z-index:3000;
  181. -webkit-transition: all 0.6s ease-in-out;
  182. -moz-transition: all 0.6s ease-in-out;
  183. -o-transition: all 0.6s ease-in-out;
  184. transition: all 0.6s ease-in-out;}
  185.  
  186. .hover:hover .sidebarcontent {
  187. opacity:0.8;
  188. -webkit-transition: all 0.6s ease-in-out;
  189. -moz-transition: all 0.6s ease-in-out;
  190. -o-transition: all 0.6s ease-in-out;
  191. transition: all 0.6s ease-in-out;}
  192.  
  193. .sidebarimage {
  194. width:400px;
  195. height:300px;
  196. background-image:url('{image:Sidebar Image}');
  197. background-repeat:no-repeat;
  198. border:10px solid {color:Info Border};}
  199.  
  200. .sidebarimage2 {
  201. opacity:1.0;
  202. width:250px;
  203. height:relative;
  204. border:4px solid {color:Content Border};}
  205.  
  206. .hover:hover .sidebarimage {
  207. opacity:0.7;
  208. -webkit-transition: all 0.6s ease-in-out;
  209. -moz-transition: all 0.6s ease-in-out;
  210. -o-transition: all 0.6s ease-in-out;
  211. transition: all 0.6s ease-in-out;}
  212.  
  213.  
  214.  
  215. .sideimgborder {
  216. width:420px;
  217. height:320px;
  218. border:6px solid {color:Content Border};
  219. -webkit-transition: all 0.6s ease-in-out;
  220. -moz-transition: all 0.6s ease-in-out;
  221. -o-transition: all 0.6s ease-in-out;
  222. transition: all 0.6s ease-in-out;}
  223.  
  224. .sideimgborder:hover {
  225. width:420px;
  226. height:430px;
  227. border:6px solid {color:Content Border};
  228. -webkit-transition: all 0.6s ease-in-out;
  229. -moz-transition: all 0.6s ease-in-out;
  230. -o-transition: all 0.6s ease-in-out;
  231. transition: all 0.6s ease-in-out;}
  232.  
  233.  
  234. .sideborder {
  235. width:36px;
  236. background-color:{color:Main Links};
  237. border-right:10px solid {color:Signature Color};
  238. opacity:0.4;
  239. margin:0;
  240. position:fixed;
  241. top:0px;
  242. height:100%;
  243. left:1000px; }
  244.  
  245. #sidebar {
  246. width: 300px;
  247. height: 100%;
  248. display: block;
  249. position: fixed;
  250. margin-top: -10px;
  251. margin-left: 120px;
  252. background-image: url('{image:sidebar}');}
  253.  
  254.  
  255. #bite
  256. #bite a{
  257. display:block}
  258. #bite .death {
  259. margin-right:0px;
  260. filter: alpha(opacity = 0);
  261. opacity:0;
  262. -webkit-transition: all 0.5s ease-out;
  263. -moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  264.  
  265. #bite:hover .death {
  266. margin-left:0px;
  267. -webkit-transition: all 0.8s ease-out;
  268. -moz-transition: all 0.8s ease-out;
  269. transition: all 0.8s ease-out;
  270. filter: alpha(opacity = 100);
  271. filter: alpha(opacity = 100);
  272. opacity:8;}
  273.  
  274. #icon {
  275. width:64px;
  276. height:64px;
  277. border:2px solid #fafafa;
  278. padding:5px;
  279. left:194px;
  280. margin-left:50px;
  281. margin-top:300px;
  282. position:fixed;}
  283.  
  284. /* -- LINKS --*/
  285.  
  286. .links {
  287. position:absolute;
  288. width:80px;
  289. line-height: 200%;
  290. text-transform: uppercase;
  291. position:fixed;
  292. opacity: 0;
  293. margin-left:205px;
  294. margin-top:-116px;
  295. text-align:center;
  296. margin-bottom:10px;
  297. display:block;
  298. padding: 0px;
  299. opacity:1;
  300. text-transform:uppercase;
  301. -webkit-transition:0.5s linear;}
  302.  
  303. .links a{
  304.  
  305. font-family:inconsolata;
  306. font-style:normal;
  307. font-size:10px;
  308. text-transform:uppercase;
  309. color:#adadad;
  310. display:block;
  311. padding-left:3px;
  312. margin-bottom: 1px;
  313. letter-spacing:0px;
  314. opacity:3;
  315. background-color:{color:linksbg};
  316. text-decoration:none;
  317. -moz-transition-duration:1s;
  318. -webkit-transition-duration:1s;
  319. -o-transition-duration:1s;}
  320.  
  321. .links a:hover{
  322. color:#5E5E5E;
  323. letter-spacing:2px;
  324. opacity:1;
  325. background-color:#fff;
  326. -webkit-transition: all 0.3s ease;
  327. -moz-transition: all 0.3s ease;
  328. -o-transition: all 0.3s ease;}
  329.  
  330. /* -- PAGINATION --*/
  331.  
  332. #pagi {
  333. position:fixed;
  334. width:500px;
  335. text-align:center;
  336. margin-top:20px;
  337. font-family:'Cuprum';
  338. font-size:8px;
  339. letter-spacing:3px;
  340. text-transform:uppercase;
  341. font-style:normal;
  342. color:{color:link};
  343. z-index:10000;
  344. background-color:white;
  345. bottom:0;
  346. padding:10px;
  347. border-top:1px solid white;
  348. }
  349.  
  350. /* -- DESC --*/
  351.  
  352. #description {
  353. font-family:cambria;
  354. font-size:9px;
  355. letter-spacing:1px;
  356. text-align:left;
  357. color:{color:desctext};
  358. background-color: #ffffff;
  359. padding: 7px;
  360. line-height:14px;
  361. width:80px;
  362. height:auto;
  363. margin-left:8px;
  364. margin-top: 293px;
  365. -webkit-transition: all 0.7s;
  366. -moz-transition: all 0.7s;
  367. transition: all 0.7s;}
  368.  
  369.  
  370. /* TAGS */
  371.  
  372. .tags {
  373. opacity:0.3; }
  374.  
  375. .quote{
  376. background-color:#fafafa;
  377. padding:5px 0px;
  378. font-size:13px;
  379. font-style:italic;}
  380.  
  381. #questions {
  382. text-align:left;
  383. text-transform:lowercase;
  384. font-size:10px;
  385. background:#fafafa;
  386. border-bottom:1px solid #e9e7e7;
  387. padding:10px;
  388. color:{color:text};}
  389.  
  390. .answer {
  391. padding:5px 5px 0px 5px;}
  392.  
  393. /* NAVIGATION */
  394.  
  395. #navigation a {
  396. background-color: {color:Content Border};
  397. display:block;
  398. font-size:7pt;
  399. margin-bottom:4px;
  400. padding:5px;
  401. width:170px;
  402. margin-left:-7px;
  403. letter-spacing:0px;
  404. text-align:center;
  405. font-family:calibri;
  406. text-shadow:none;
  407. text-transform:uppercase;
  408. color: {color:Bold}; }
  409.  
  410. #navigation a:hover {
  411. background-color: {color:Text};
  412. color: {color:Background};
  413. text-shadow:none;
  414. text-decoration:none;
  415. text-align:center;
  416. -webkit-transition: opacity 0.7s linear;
  417. -webkit-transition: all 0.7s ease-out;
  418. -moz-transition: all 0.7s ease-out;
  419. transition: all 0.7s ease-out;}
  420.  
  421. #audio {
  422. background-color: white;
  423. margin-left:30px;}
  424.  
  425. .albumart img {
  426. float:left;
  427. width:70px;}
  428.  
  429. .audiocaption {
  430. margin-left:50px;
  431. text-transform:uppercase; }
  432.  
  433. .baslik {
  434. font-size: 13px;
  435. text-transform: uppercase;
  436. color: {color:accent};
  437. letter-spacing: 1px;
  438. font-family: 'Open Sans Condensed';
  439. padding-left: 15px;}
  440.  
  441. .baslik a {
  442. color: {color:accent};}
  443.  
  444. .baslik a:hover {
  445. color: {color:link hover};}
  446.  
  447. /* EXTRAS LINKS */
  448.  
  449. #extraslinks a {
  450. background-color: {color:Content BG};
  451. border:1px solid {color:Content Border};
  452. display:block;
  453. font-size:7pt;
  454. margin-bottom:2px;
  455. padding:5px;
  456. width:100px;
  457. margin-left:-7px;
  458. letter-spacing:0px;
  459. text-align:center;
  460. font-family:calibri;
  461. text-shadow:none;
  462. text-transform:uppercase;
  463. color: {color:Bold}; }
  464.  
  465. #extraslinks a:hover {
  466. background-color: {color:bold};
  467. color: {color:Background};
  468. text-shadow:none;
  469. text-decoration:none;
  470. text-align:center;
  471. -webkit-transition: opacity 0.7s linear;
  472. -webkit-transition: all 0.7s ease-out;
  473. -moz-transition: all 0.7s ease-out;
  474. transition: all 0.7s ease-out;}
  475.  
  476. /* EXTRAS */
  477.  
  478. .extras {
  479. width:520px;
  480. z-index:2000;
  481. padding:0px;
  482. letter-spacing:0;}
  483.  
  484. .push {
  485. background:transparent;
  486. opacity:0;
  487. margin-top:0px;
  488. text-align:left;
  489. margin-left:520px;
  490. position:absolute;
  491. -webkit-transition: opacity 0.7s linear;
  492. -webkit-transition: all 0.7s ease-out;
  493. -moz-transition: all 0.7s ease-out;
  494. transition: all 0.7s ease-out;}
  495.  
  496. .extras:hover .push {
  497. opacity:1.0;
  498. margin-left:540px;
  499. -webkit-transition: opacity 0.7s linear;
  500. -webkit-transition: all 0.7s ease-out;
  501. -moz-transition: all 0.7s ease-out;
  502. transition: all 0.7s ease-out;}
  503.  
  504. #postinfo{
  505. text-transform:lowercase;
  506. font-family:times;
  507. font-size:9px;
  508. text-align:left;
  509. word-spacing:1px;
  510. font-style:none;
  511. padding-top:10px;
  512. padding-left:3px;}
  513.  
  514. .date a, .date a:link {
  515. text-transform:uppercase;
  516. padding:4px;
  517. padding-left:8px;
  518. padding-right:8px;
  519. color:#fff;
  520. background:{color:bold};}
  521.  
  522.  
  523. #tagbox{
  524. margin-top:10px;
  525. text-align:left;
  526. font-style:italic;
  527.  
  528. {block:ifNotsmallerposts}
  529. width:500px;{/block:ifNotsmallerposts}{block:ifsmallerposts}
  530. width:400px;{/block:ifsmallerposts}}
  531.  
  532. #postnotes{
  533. height:200px;
  534. overflow:auto;
  535. font-size:9px;
  536. line-height:190%;
  537. letter-spacing:1px;
  538. text-transform:lowercase; }
  539.  
  540. #postnotes a{
  541. font-style:italic;}
  542.  
  543. #postnotes img{
  544. display:none; }
  545.  
  546. /* -- CREDIT -- */
  547.  
  548. #credit {
  549. position:fixed;
  550. right:10px;
  551. bottom:10px;
  552. text-transform:uppercase;
  553. font:10px 'cambria';
  554. letter-spacing:1px;
  555. padding:5px;
  556. -webkit-transition: all 0.5s ease;
  557. -moz-transition: all 0.5s ease;
  558. -ms-transition: all 0.5s ease;
  559. -o-transition: all 0.5s ease;
  560. transition: all 0.5s ease;}
  561.  
  562. #credit:hover {
  563. position:fixed;
  564. right:10px;
  565. bottom:10px;
  566. text-transform:uppercase;
  567. font:10px 'cambria';
  568. letter-spacing:1px;
  569. padding:5px;
  570. text-shadow: 1px 1px 1px #bebebe;
  571. -webkit-transition: all 0.5s ease;
  572. -moz-transition: all 0.5s ease;
  573. -ms-transition: all 0.5s ease;
  574. -o-transition: all 0.5s ease;
  575. transition: all 0.5s ease;}
  576.  
  577. </style>
  578. </head>
  579. <body>
  580.  
  581.  
  582.  
  583. <div id="bite"> <div id="sidebar">
  584.  
  585.  
  586.  
  587. <div id="icon"><img src="{PortraitURL-64}" /></div>
  588. <div class="death"><div id="description">{block:Description}{Description}{/block:Description}</div><br><br>
  589.  
  590.  
  591. <div class="links">
  592. {block:IfLink1}
  593. <a href="{text:link1 url}">{text:link1}</a>
  594. {/block:IfLink1}
  595. {block:IfLink2}
  596. <a href="{text:link2 url}">{text:link2}</a>
  597. {/block:IfLink2}
  598. {block:IfLink3}
  599. <a href="{text:link3 url}">{text:link3}</a>
  600. {/block:IfLink3}
  601. {block:IfLink4}
  602. <a href="{text:link4 url}">{text:link4}</a>
  603. {/block:IfLink4}
  604. </div></div>
  605.  
  606. </div>
  607.  
  608. </div>
  609.  
  610. <div id="credit"><a href="http://llermans.tumblr.com/" target="_blank">LLMNS</a></div>
  611.  
  612. <div class="contentwhole">
  613.  
  614. {block:Posts}
  615.  
  616. <div id="pagi">
  617. {block:PreviousPage}
  618. <a href="{PreviousPage}">←</a>
  619. {/block:PreviousPage}
  620.  
  621. {block:JumpPagination length="5"}
  622. {block:CurrentPage}
  623. <span class="current_page">{PageNumber}</span>
  624. {/block:CurrentPage}
  625.  
  626. {block:JumpPage}
  627. <a href="{URL}">{PageNumber}</a>
  628. {/block:JumpPage}
  629. {/block:JumpPagination}
  630.  
  631. {block:NextPage}
  632. <a href="{NextPage}">β†’</a>
  633. {/block:NextPage}
  634. {/block:Pagination}
  635.  
  636. </div>
  637.  
  638. <div class="extras">
  639.  
  640. <div class="push">
  641. <div id="extraslinks">
  642.  
  643. <a href="{ReblogURL}" target="_blank" title="reblog this post!">REBLOG</a>
  644. {block:RebloggedFrom}<a href="{ReblogParentURL}">VIA</a>{/block:RebloggedFrom}
  645. {block:ContentSource} <a href="{SourceURL}">SOURCE</a>{/block:ContentSource}</a>
  646.  
  647. </div> <!-- END EXTRA LINKS -->
  648. <!-- END TAGS -->
  649. </div> <!-- END PUSH -->
  650.  
  651.  
  652. <div class="content">
  653.  
  654.  
  655. {block:Text}
  656. {block:Title}
  657. {Title}
  658. {/block:Title}
  659. {Body}
  660. {/block:Text}
  661.  
  662. {block:Photo}
  663. <img class="photo" src="{PhotoURL-500}" alt="{PhotoAlt}" />
  664. {block:Caption}{Caption}{/block:Caption}
  665. {/block:Photo}
  666.  
  667. {block:Photoset}
  668. {Photoset-500}
  669. {block:Caption}{Caption}{/block:Caption}
  670. {/block:Photoset}
  671.  
  672. {block:Quote}
  673. <center><div class="quote">{Quote}</div>
  674. {block:Source}<br><div class="quotesource">― {Source}</div>
  675. {/block:Source}</center>
  676. {/block:Quote}
  677.  
  678. {block:Link}
  679. <a href="{URL}" target="{Target}" class="ttitle"> {Name} </a>
  680. {block:Description} {Description} {/block:Description}
  681. {/block:Link}
  682.  
  683. {block:Chat}{block:Title}<div class="baslik">{Title}</div>
  684. {/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label}
  685. {Line}<br>{/block:Lines}{/block:Chat}
  686.  
  687.  
  688.  
  689.  
  690. {block:AudioPlayer}<section class="top audio">{block:AlbumArt}
  691. <div class="albumart"><img src="{AlbumArtURL}"></div>
  692. {/block:AlbumArt} <div id="audio">{AudioPlayerWhite}
  693. <div class="audiocaption">{block:Artist}<b>Artist</b>:
  694. {Artist}{/block:Artist}<br>
  695. {block:Album}<b>Album</b>: {Album}{/block:Album}<br>
  696. {block:TrackName}<b>Track</b>: {TrackName}{/block:TrackName}</div></div></section>
  697. {/block:AudioPlayer}<br>
  698.  
  699. {block:Video}
  700. {Video-500}
  701. {block:Caption}{Caption}{/block:Caption}
  702. {/block:Video}
  703.  
  704. {block:Answer}
  705. <div id="questions">
  706. {Question} - <b>{Asker}</b>
  707. <br />
  708. </div>
  709. <div class="answer">
  710. {Answer}</div>
  711. {/block:Answer}
  712. </div>
  713.  
  714.  
  715. <!--END INFO -->
  716. <!-- END CONTENT -->
  717. </div><!-- END EXTRAS -->
  718. <div id="postinfo">
  719.  
  720. {block:Date}<span class="date"><a href="{Permalink}">{ShortMonth}
  721. {DayOfMonthWithZero}</a></span>{/block:Date}
  722.  
  723. <span style="letter-spacing:1px;">{block:NoteCount}&nbsp;&nbsp;
  724. <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  725.  
  726. <span style="font-style:italic; letter-spacing:1px;">
  727. {block:HasTags}&nbsp;&nbsp;#{block:Tags} <a href="{TagURL}">{Tag}
  728. </a>&nbsp;{/block:Tags}{/block:HasTags}</span>
  729. </div>
  730. <div class="note">
  731. {block:PostNotes}<br><bR><br><br>{PostNotes}{/block:PostNotes}
  732. </div>
  733. {/block:Posts}
  734. </div> <!-- END CONTENT WHOLE -->
  735.  
  736.  
  737.  
  738. </body>
  739. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement