API tools faq
paste
Advertisement
codesbyrhass

Theme #04 - Wrecking Ball

codesbyrhass
Sep 23rd, 2013
4,648
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.88 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <!--
  4.  
  5. THEME #04 - WRECKING BALL
  6.  
  7. ~ http://themesbyrhass.tumblr.com
  8.  
  9. HOW TO INSTALL
  10. - READ MY FAQs (themesbyrhass.tumblr.com/faqs)
  11.  
  12. RULES:
  13. - DONT REMOVE THE CREDIT.
  14. - YOU CAN EDIT THIS THEME BUT DONT TAKE IT AS YOURS.
  15. - DONT OWN THIS THEME
  16. - DONT REDISTRIBUTE
  17. - DONT TAKE SOME PART OF THE THEME
  18.  
  19.  
  20. THANK YOU.
  21.  
  22. - IF YOU HAVE QUESTIONS OR ENCOUNTERING PROBLEMS JUST MESSAGE ME. ;*
  23.  
  24. -->
  25.  
  26.  
  27. <html>
  28. <head>
  29. <title>{Title}</title>
  30.  
  31. {block:Description}
  32. <meta name="description" content="{MetaDescription}" />
  33. {/block:Description}
  34.  
  35. <link rel="shortcut icon" href="{Favicon}" />
  36. <link href='http://fonts.googleapis.com/css?family=Lily+Script+One|Oleo+Script+Swash+Caps|Clicker+Script|Oswald|Anaheim|Bubbler+One|Cookie|Open+Sans+Condensed:300|Open+Sans' rel='stylesheet' type='text/css'>
  37.  
  38.  
  39. <meta name="image:background" content="http://25.media.tumblr.com/tumblr_m33qwzyv7F1r6uwfxo12_r1_250.png"/>
  40. <meta name="image:headericon" content="http://24.media.tumblr.com/0a422fd3d9a7c309c2f9d4545f974be3/tumblr_mtkupiAzvj1rabmuco1_500.gif"/>
  41.  
  42. <meta name="color:background" content="#ffffff">
  43.  
  44. <meta name="color:headerbg" content="#000000">
  45. <meta name="color:headerborder" content="#FA023C">
  46. <meta name="color:headertitle" content="#FA023C">
  47. <meta name="color:headersubtitle" content="#ffffff">
  48.  
  49. <meta name="color:postbg" content="#ffffff">
  50. <meta name="color:post title" content="#FA023C">
  51. <meta name="color:postborder" content="#FA023C">
  52.  
  53. <meta name="color:caption" content="#000000">
  54. <meta name="color:captionbold" content="#000000">
  55. <meta name="color:captionitalic" content="#000000">
  56. <meta name="color:captionlinksbg" content="#FA023C">
  57. <meta name="color:captionlinkstext" content="#000000">
  58. <meta name="color:captionlinkshover" content="#ffffff">
  59. <meta name="color:captionblockquote" content="#FA023C">
  60.  
  61. <meta name="color:quotesourcelink" content="#FA023C">
  62. <meta name="color:quotesourcelinkhover" content="#ffffff">
  63.  
  64. <meta name="color:chateven" content="#FA023C">
  65.  
  66. <meta name="if:MonochromeImages" content="1">
  67. <meta name="if:FixedHeader" content="1">
  68. <meta name="if:FixedSidelinks" content="1">
  69. <meta name="if:FixedDescriptionBox" content="0">
  70.  
  71. <meta name="text:CustomTitle" content="Custom Title" />
  72. <meta name="text:CustomTitle2" content="Custom Title 2" />
  73.  
  74. <meta name="text:Link 1" content="Link 1" />
  75. <meta name="text:Link 1 URL" content="/" />
  76. <meta name="text:Link 2" content="Link 2" />
  77. <meta name="text:Link 2 URL" content="/" />
  78. <meta name="text:Link 3" content="Link 3" />
  79. <meta name="text:Link 3 URL" content="/" />
  80. <meta name="text:Link 4" content="Link 4" />
  81. <meta name="text:Link 4 URL" content="/" />
  82. <meta name="text:Link 5" content="Link 5" />
  83. <meta name="text:Link 5 URL" content="/" />
  84.  
  85. <style type="text/css">
  86.  
  87.  
  88. /* --- SCROLL BAR ---*/
  89.  
  90. ::-webkit-scrollbar-thumb:horizontal {
  91. background-color:{color:headerborder};
  92. height: 40px;
  93. width: 5px;
  94. border-radius: 50px;
  95. border: 2px solid {color:headerborder};
  96. }
  97.  
  98. ::-webkit-scrollbar-thumb:vertical {
  99. background-color:{color:headerborder};
  100. height: 40px;
  101. width:5px;
  102. border-radius: 50px;
  103. border: 2px solid {color:headerborder};
  104. }
  105.  
  106.  
  107. ::-webkit-scrollbar {
  108. height: 10px;
  109. width: 10px;
  110. background-color:{color:headerbg};
  111. }
  112.  
  113. /* ---- BODY --- */
  114.  
  115. body{
  116. background-color: {color:background};
  117. background-image: url({image:background});
  118. background-attachment: fixed;
  119. margin: 0;
  120. }
  121.  
  122. a {
  123. text-decoration:none;
  124. }
  125.  
  126. a:hover { text-decoration:none;
  127.  
  128. }
  129.  
  130. /* --- HEADER --- */
  131. #header{
  132. {block:IfNotFixedHeader}
  133. position: relative;
  134. {block:IfNotFixedHeader}
  135. {block:IfFixedHeader}
  136. position: fixed;
  137. {block:IfFixedHeader}
  138. left:0px;
  139. top: 0px;
  140. bottom: 20px;
  141. height:50px;
  142. width:100%;
  143. background:{color:headerbg};
  144. padding: 10px;
  145. z-index: 1;
  146. border-bottom: 10px solid {color:headerborder};
  147.  
  148. }
  149.  
  150. #header img{
  151. width: 100px;
  152. height: 100px;
  153. position: absolute;
  154. display: inline-block;
  155. margin-left: 200px;
  156. margin-top: 10px;
  157. border-radius: 100%;
  158. border: 10px solid {color:headerborder};
  159.  
  160. }
  161.  
  162.  
  163. {block:ifNotFixedDescriptionBox}
  164. #header:hover #desc{
  165. opacity: 1;
  166. margin-left: 5px;
  167. -webkit-transition: opacity 0.7s linear;
  168. -webkit-transition: all 0.7s ease-out;
  169. -moz-transition: all 0.7s ease-out;
  170. transition: all 0.7s ease-out;
  171.  
  172. }
  173. {/block:ifNotFixedDescriptionBox}
  174.  
  175. /* --- HEADER TITLE & SUBTITLE --- */
  176.  
  177. #head_title{
  178. font-family: 'Anaheim', sans-serif;
  179. font-size: 20px;
  180. color: {color:headertitle};
  181. margin-top: -59px;
  182. margin-left: 330px;
  183. text-transform: uppercase;
  184. float:left;
  185. }
  186.  
  187.  
  188. #head_subtitle{
  189. font-family: 'Anaheim', sans-serif;
  190. font-size: 10px;
  191. color: {color:headersubtitle};
  192. margin-top: -5px;
  193. text-transform: uppercase;
  194. letter-spacing: 2px;
  195. }
  196.  
  197. /* --- DESCRIPTION --- */
  198. #desc{
  199. position: fixed;
  200. text-align: center;
  201. text-indent: 10px;
  202. width: 150px;
  203. margin-top: 15px;
  204. {block:ifNotFixedDescriptionBox}
  205. margin-left: 50px;
  206. {/block:ifNotFixedDescriptionBox}
  207. {block:ifFixedDescriptionBox}
  208. margin-left: 5px;
  209. {/block:ifFixedDescriptionBox}
  210. padding: 20px;
  211. font-size: 9px;
  212. letter-spacing: 1px;
  213. line-height: 10px;
  214. font-family: 'Anaheim', sans-serif;
  215. text-transform: uppercase;
  216. background-color: {color:headerborder};
  217. {block:ifNotFixedDescriptionBox}
  218. opacity: 0;
  219. {/block:ifNotFixedDescriptionBox}
  220. {block:ifFixedDescriptionBox}
  221. opacity: 1;
  222. {/block:ifFixedDescriptionBox}
  223. -webkit-transition: all 0.9s;
  224. -moz-transition: all 0.9s;
  225. -o-transition: all 0.9s ;
  226.  
  227. }
  228.  
  229. #desc:first-letter{
  230. font-family: Oleo Script Swash Caps;
  231. font-size: 15px;
  232. }
  233.  
  234. #desc b, strong{
  235. font-weight: bold;
  236. }
  237.  
  238. #desc i, em{
  239. font-style: italic;
  240. }
  241.  
  242. #desc a{
  243. text-decoration: none;
  244. color: {color:background};
  245. }
  246.  
  247. #desc a:hover{
  248. text-decoration: none;
  249. color: {color:caption};
  250. }
  251.  
  252. /* --- HEADER LINKS --- */
  253.  
  254. #head_links{
  255. display: inline-block;
  256. float: left;
  257. margin-left: 500px;
  258. right: 5px;
  259. margin-top: 50px;
  260. }
  261.  
  262. #head_links a{
  263. font-family: 'Anaheim', sans-serif;
  264. font-size: 10px;
  265. color: {color:headersubtitle};
  266. background: {color:headerborder};
  267. padding: 10px 15px;
  268. letter-spacing: 2px;
  269. text-transform: uppercase;
  270. -webkit-transition: all 0.3s ease;
  271. -moz-transition: all 0.3s ease;
  272. transition: all 0.3s ease;
  273.  
  274. }
  275.  
  276. #head_links a:hover{
  277. padding-top: 20px;
  278. padding-bottom: 20px;
  279. -webkit-transition: opacity 0.7s linear;
  280. -webkit-transition: all 0.7s ease-out;
  281. -moz-transition: all 0.7s ease-out;
  282. transition: all 0.7s ease-out;
  283.  
  284. }
  285.  
  286. /* --- SIDE LINKS --- */
  287. #sidelinks {
  288. {block:IfNotFixedSidelinks}
  289. position: absolute;
  290. {block:IfNotFixedSidelinks}
  291. {block:IfFixedSidelinks}
  292. position: fixed;
  293. {block:IfFixedSidelinks}
  294. left: 245px;
  295. margin-top: 10px;
  296. }
  297. .slinks_circle {
  298. width: 50px;
  299. height: 50px;
  300. overflow: hidden;
  301. margin-bottom: 10px;
  302. border-radius: 100px;
  303. -moz-border-radius: 100px;
  304. -webkit-border-radius: 100px;
  305. -o-border-radius: 100px;
  306. background: {color:headerborder};
  307. padding: 1px;
  308.  
  309. }
  310.  
  311. .slinks_circle:hover{
  312. background: {color:headerbg};
  313. -webkit-transition: opacity 0.7s linear;
  314. -webkit-transition: all 0.7s ease-out;
  315. -moz-transition: all 0.7s ease-out;
  316. transition: all 0.7s ease-out;
  317. }
  318.  
  319. .slinks_circle:hover .slinks{
  320. opacity: 1;
  321. left: 50px;
  322. -webkit-transition: opacity 0.7s linear;
  323. -webkit-transition: all 0.7s ease-out;
  324. -moz-transition: all 0.7s ease-out;
  325. transition: all 0.7s ease-out;
  326. }
  327.  
  328.  
  329. .slinks{
  330. position: fixed;
  331. text-align: center;
  332. text-indent: 10px;
  333. width: 150px;
  334. margin-top: 10px;
  335. left: 60px;
  336. text-decoration:none;
  337. padding: 10px;
  338. font-size: 9px;
  339. letter-spacing: 1px;
  340. line-height: 10px;
  341. font-family: 'Anaheim', sans-serif;
  342. text-transform: uppercase;
  343. color: #fff;
  344. background-color: {color:headerborder};
  345. opacity: 0;
  346. -webkit-transition: all 0.9s;
  347. -moz-transition: all 0.9s;
  348. -o-transition: all 0.9s ;
  349. }
  350.  
  351. .slinks:hover{
  352. background:{color:headerbg};
  353. }
  354.  
  355.  
  356. /* --- CONTAINER --- */
  357. #container {
  358. margin-left: 420px;
  359. margin-top:170px;
  360. margin-bottom:50px;
  361. width: 520px;
  362. }
  363.  
  364. #posts {
  365. background-color:{color:postbg};
  366. text-align:justify;
  367. margin-top:40px;
  368. padding:20px;
  369. border:1px solid {color:postborder};
  370. width:500px;
  371. }
  372.  
  373. {block:IfMonochromeImages}
  374. #posts img{
  375. padding: 0px;
  376. filter: none;
  377. -webkit-filter: grayscale(0%);
  378. -webkit-transition: all 0.7s linear;
  379. -moz-transition: all 0.7s linear;
  380. -o-transition: all 0.7s linear;
  381.  
  382. }
  383.  
  384. #posts img:hover {
  385. padding: 0px;
  386. filter: gray;
  387. -webkit-filter: grayscale(100%);
  388. -webkit-transition: all 0.7s linear;
  389. -moz-transition: all 0.7s linear;
  390. -o-transition: all 0.7s linear;
  391. }
  392.  
  393. iframe.photoset {
  394. padding: 0px;
  395. filter: none;
  396. -webkit-filter: grayscale(0%);
  397. -webkit-transition: all 0.7s linear;
  398. -moz-transition: all 0.7s linear;
  399. -o-transition: all 0.7s linear;
  400.  
  401. }
  402.  
  403. iframe.photoset:hover {
  404. filter: gray;
  405. -webkit-filter: grayscale(100%);
  406. -webkit-transition: all 0.7s linear;
  407. -moz-transition: all 0.7s linear;
  408. -o-transition: all 0.7s linear;
  409. }
  410. {/block:IfMonochromeImages}
  411.  
  412. {block:IfNotMonochromeImages}
  413. #posts img{
  414. padding: 0px;
  415. filter: none;
  416. -webkit-filter: grayscale(0%);
  417. -webkit-transition: all 0.7s linear;
  418. -moz-transition: all 0.7s linear;
  419. -o-transition: all 0.7s linear;
  420.  
  421. }
  422.  
  423. #posts img:hover {
  424. padding: 0px;
  425. filter: none;
  426. -webkit-filter: grayscale(0%);
  427. -webkit-transition: all 0.7s linear;
  428. -moz-transition: all 0.7s linear;
  429. -o-transition: all 0.7s linear;
  430. }
  431.  
  432. iframe.photoset {
  433. padding: 0px;
  434. filter: none;
  435. -webkit-filter: grayscale(0%);
  436. -webkit-transition: all 0.7s linear;
  437. -moz-transition: all 0.7s linear;
  438. -o-transition: all 0.7s linear;
  439.  
  440. }
  441.  
  442. iframe.photoset:hover {
  443. filter: none;
  444. -webkit-filter: grayscale(0%);
  445. -webkit-transition: all 0.7s linear;
  446. -moz-transition: all 0.7s linear;
  447. -o-transition: all 0.7s linear;
  448. }
  449. {/block:IfNotMonochromeImages}
  450.  
  451.  
  452. /* --- TITLE --- */
  453. #posttitle{
  454. font-family: 'Anaheim', sans-serif;
  455. font-size: 18px;
  456. text-align: center;
  457. padding: 20px;
  458. border-bottom: 1px solid {color:postborder};
  459. color: {color:post title};
  460.  
  461. }
  462.  
  463. /* --- CAPTION --- */
  464. #caption{
  465. font-family: calibri;
  466. font-size: 11px;
  467. text-align: justify;
  468. padding: 20px;
  469. color: {color:caption};
  470. }
  471.  
  472. #caption a{
  473. text-decoration: none;
  474. padding: 1px;
  475. background: {color:captionlinksbg};
  476. color: {color:captionlinkstext};
  477. -webkit-filter: grayscale(0%);
  478. -webkit-transition: all 0.7s linear;
  479. -moz-transition: all 0.7s linear;
  480. -o-transition: all 0.7s linear;
  481. }
  482.  
  483. #caption a:hover {
  484. text-decoration:none;
  485. background: transparent;
  486. color: {color:caption};
  487. -webkit-filter: grayscale(0%);
  488. -webkit-transition: all 0.7s linear;
  489. -moz-transition: all 0.7s linear;
  490. -o-transition: all 0.7s linear;
  491.  
  492. }
  493.  
  494. #caption b, strong{
  495. font-weight: bold;
  496. color:{color:captionbold};
  497. }
  498.  
  499. #caption i, em{
  500. font-style: italic;
  501. color: {color:captionitalic};
  502. }
  503.  
  504. #caption big{
  505. font-size: 14px;
  506. color: {color:caption};
  507. }
  508.  
  509. #caption small{
  510. font-size: 10px;
  511. color: {color:caption};
  512. }
  513.  
  514. #caption blockquote{
  515. border-left:3px solid {color:captionblockquote};
  516. padding:5px;
  517. margin:10px;
  518. }
  519.  
  520. #caption blockquote img{
  521. width: 250px;
  522. height: auto;
  523. }
  524.  
  525. #caption pre{
  526. white-space: pre-wrap;
  527. padding: 12px;
  528. background: {color:headerborder};
  529. line-height: 110%;
  530. font-family: courier new;
  531. font-size:10px;
  532. color: {color:headertitle};
  533. text-align: center;
  534. letter-spacing: 1.5px;
  535. }
  536.  
  537. #caption strike{
  538. color: {color:caption};
  539. }
  540.  
  541.  
  542. /* --- LINK --- */
  543.  
  544. #linkpost{
  545. font-family: Oswald;
  546. font-size: 20px;
  547. line-height:23px;
  548. padding: 30px;
  549. background:{color:captionlinksbg};
  550. text-align: center;
  551. text-transform: uppercase;
  552. text-decoration: none;
  553.  
  554. }
  555.  
  556. #linkpost:hover{
  557. background: {color:captionlinkshover};
  558. color:{color:captionlinkstext};
  559. -webkit-transition: opacity 0.7s linear;
  560. -webkit-transition: all 0.7s ease-out;
  561. -moz-transition: all 0.7s ease-out;
  562. transition: all 0.7s ease-out;
  563. }
  564.  
  565. #linkpost a{
  566. text-decoration:none;
  567. color:{color:captionlinkstext};
  568. }
  569.  
  570. /* --- QUOTE --- */
  571. .quote {
  572. margin-left:40px;
  573. margin-top:30px;
  574. margin-right:40px;
  575. margin-bottom:30px;
  576. font-size:15px;
  577. line-height:15px;
  578. font-family: 'Anaheim', sans-serif;
  579. text-transform: uppercase;
  580. }
  581.  
  582. .quote:first-letter{
  583. font-family: Cookie;
  584. font-size: 50px;
  585. font-style:italic;
  586. font-weight:bold;
  587. padding-right: 2px;
  588. }
  589.  
  590. .quotation {
  591. font-family:'Georgia', sans-serif;
  592. font-size:100px;
  593. opacity:0.2;
  594. margin-top:-10px;
  595. position:absolute;
  596.  
  597. }
  598.  
  599. .source {
  600. text-align:right;
  601. font-family: calibri;
  602. font-size: 12px;
  603. margin-left:40px;
  604. margin-right:40px;
  605. color:{color:caption};
  606. }
  607. .source a{
  608. text-decoration: none;
  609. color: {color:quotesourcelink};
  610. }
  611.  
  612. .source a:hover{
  613. text-decoration: none;
  614. color: {color:caption};
  615. }
  616.  
  617. .source b, strong{
  618. font-weight: bold;
  619. color:{color:captionbold};
  620. }
  621.  
  622. .source i, em{
  623. font-style: italic;
  624. color: {color:captionitalic};
  625. }
  626.  
  627. .source big{
  628. font-size: 14px;
  629. color: {color:caption};
  630. }
  631.  
  632. .source small{
  633. font-size: 10px;
  634. color: {color:caption};
  635. }
  636.  
  637. .source blockquote{
  638. border-right:3px solid {color:captionblockquote};
  639. padding:5px;
  640. margin:10px;
  641. }
  642.  
  643. .source blockquote img{
  644. width: 250px;
  645. height: auto;
  646. }
  647.  
  648.  
  649. /* --- CHAT --- */
  650.  
  651. #chat{
  652. line-height:20px;
  653. padding: 20px;
  654. font-family: courier new;
  655. font-size: 11px;
  656. }
  657.  
  658. #chat hr{
  659. border:2px solid {color:headerborder};
  660. height:1px;
  661. opacity:0.9;
  662. }
  663.  
  664. #chatlabel{
  665. font-weight:bold;
  666. display:inline;
  667. }
  668.  
  669. .c2, .c4, .c6, .c8, .c10, .c12, .c14{
  670. color:{color:chateven};
  671. }
  672.  
  673.  
  674.  
  675. /* --- TUMBLR ASK --- */
  676. .question {
  677. background-color:{color:headerbg};
  678. text-align:justify;
  679. font-size:12px;
  680. color:{color:headersubtitle};
  681. font-style:italic;
  682. padding:15px;
  683. line-height: 120%;
  684. font-family: calibri;
  685. border: 3px solid {color:headerborder};
  686. display: block;
  687. }
  688.  
  689. .question a{
  690. text-decoration: none;
  691. color: {color:headertitle};
  692. font-weight: bold;
  693. }
  694. .question a:hover{
  695. text-decoration: none;
  696. color: {color:headersubtitle};
  697. font-weight: bold;
  698. }
  699.  
  700. /* --- AUDIO POST --- */
  701.  
  702. #audio{
  703. z-index:1;
  704. background: {color:headerbg};
  705. border: 5px solid {color:headerborder};
  706. height: 100%;
  707. }
  708. #albumart{
  709. width:100px;
  710. height:100px;
  711. margin-left: -10px;
  712. }
  713. #albumart img{
  714. width:70px;
  715. margin-top: 12px;
  716. background:{color:headerborder};
  717. padding:5px;
  718. }
  719.  
  720. #albumart img:hover{
  721. width:70px;
  722. margin-top: 12px;
  723. background:{color:headerborder};
  724. padding:5px;
  725. }
  726.  
  727.  
  728. #player{
  729. padding:10px;
  730. position:absolute;
  731. margin-top:24px;
  732. margin-left:410px;
  733. z-index:999
  734. }
  735.  
  736. #player2{
  737. width:26px;
  738. height:50px;
  739. overflow: hidden;
  740. }
  741.  
  742. #albuminfotitle{
  743. font-size:20px;
  744. font-family: 'Anaheim', sans-serif;
  745. text-transform: uppercase;
  746. letter-spacing:1px;
  747. position:absolute;
  748. margin-top:-80px;
  749. margin-left:75px;
  750. text-align:left;
  751. color:{color:headertitle};
  752. }
  753.  
  754. #alinfo{
  755. margin-top:-85px;
  756. margin-left:75px;
  757. padding:30px 10px;
  758. font-size: 11px;
  759. font-family: Calibri;
  760. line-height:16px;
  761. text-align:left;
  762. text-transform: uppercase;
  763. color: {color:headersubtitle};
  764. }
  765.  
  766.  
  767. /* --- PERMALINKS/POST INFO --- */
  768.  
  769. #perma_date {
  770. position:absolute;
  771. width: 100%
  772. height: auto;
  773. margin-left:520px;
  774. font-size:9px;
  775. font-family:'Anaheim', sans-serif;
  776. letter-spacing: 2px;
  777. text-transform:uppercase;
  778. padding: 10px;
  779. text-align:center;
  780. background: {color:headerborder};
  781. color:{color:headersubtitle};
  782. }
  783.  
  784. #perma_date:hover #via_sou {
  785. opacity: 1;
  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. #perma_date a {
  794. text-decoration: none;
  795. font-size: 11px;
  796. color:{color:headersubtitle};
  797. }
  798.  
  799. #perma_date a:hover{
  800. color: {color:headerbg};
  801. }
  802.  
  803. #via_sou {
  804. float:center;
  805. position:absolute;
  806. margin-top:25px;
  807. margin-left:-2px;
  808. opacity:0;
  809. -webkit-transition: all 0.7s ease-in-out;
  810. -moz-transition: all 0.7s ease-in-out;
  811. -o-transition: all 0.7s ease-in-out;
  812. -ms-transition: all 0.7s ease-in-out;
  813. transition: all 0.7s ease-in-out;
  814. }
  815.  
  816. #via_sou img {
  817. margin-bottom:10px;
  818.  
  819. }
  820.  
  821. /* --- TAGS --- */
  822.  
  823. #tags {
  824. font-family: 'Anaheim', sans-serif;
  825. font-size: 10px;
  826. margin:10px;
  827. text-align:left;
  828. padding:10px;
  829. text-transform: uppercase;
  830. color: {color:headersubtitle};
  831. background-color:{color:headerborder};
  832. }
  833.  
  834. #tags a {
  835. text-decoration: none;
  836. color:{color:headerbg};
  837. }
  838.  
  839. #tags a:hover{
  840. text-decoration:line-through;
  841. }
  842.  
  843. .tagged {
  844. font-family: calibri;
  845. font-size:10px;
  846. text-transform:uppercase;
  847. letter-spacing:-1px;
  848. color: {color:caption};
  849. }
  850.  
  851.  
  852. /* --- NOTES --- */
  853. .note {
  854. width: 500px;
  855. text-transform:uppercase;
  856. font-style:normal;
  857. letter-spacing:0px;
  858. font-size: 9px;
  859. text-align:left;
  860. line-height:90%;
  861. margin-left:-45px;
  862. font-family: calibri;
  863. color:{color:caption};
  864.  
  865. }
  866.  
  867. .note a{
  868. color: {color:headerborder};
  869. }
  870.  
  871. .note a:hover{
  872. color:{color:headerbg};
  873. }
  874.  
  875. .note li {
  876. list-style-type:none;
  877. border-bottom:1px solid #ccc;
  878. padding:2px ;
  879. text-align:left;
  880. margin:0px;
  881. -moz-transition-duration:0.5s;
  882. -webkit-transition-duration:0.5s;
  883. -o-transition-duration:0.5s;
  884. }
  885.  
  886. .note img.avatar {
  887. width: 20px;
  888. height: 20px;
  889. border-radius: 5px;
  890. -moz-border-radius: 5px;
  891. }
  892.  
  893.  
  894.  
  895. /* --- PAGINATION --- */
  896. #pagination {
  897. position: fixed;
  898. bottom: 100px;
  899. left: 235px;
  900. }
  901.  
  902. .pagearrow {
  903. padding: 5px;
  904. font-family: 'Anaheim', sans-serif;
  905. font-size: 11px;
  906. color: #fff;
  907. height: auto;
  908. line-height: 14px;
  909. float: left;
  910. margin: 0 2px;
  911. background: {color:headerborder};
  912. -webkit-transition: all 0.4s ease-in-out;
  913. -moz-transition: all 0.4s ease-in-out;
  914. -o-transition: all 0.4s ease-in-out;
  915. -ms-transition: all 0.4s ease-in-out;
  916. transition: all 0.4s ease-in-out;
  917. }
  918.  
  919. .pagearrow:hover {
  920. background: {color:headerbg};
  921. color: #fff;
  922. -webkit-transition: all 0.4s ease-in-out;
  923. -moz-transition: all 0.4s ease-in-out;
  924. -o-transition: all 0.4s ease-in-out;
  925. -ms-transition: all 0.4s ease-in-out;
  926. transition: all 0.4s ease-in-out;
  927. }
  928.  
  929. .pages {
  930. font-family: 'Anaheim', sans-serif;
  931. font-size: 11px;
  932. color: #fff;
  933. padding: 5px;
  934. height: 14px;
  935. line-height: 14px;
  936. float: left;
  937. margin: 0 2px;
  938. background-color: {color:headerbg};
  939.  
  940. }
  941.  
  942. /* --- CREDIT --- */
  943. #credit{
  944. bottom: 15px;
  945. right: 10px;
  946. position: fixed;
  947. font-family: 'Anaheim', sans-serif;
  948. font-size: 11px;
  949. text-transform: uppercase;
  950.  
  951. }
  952.  
  953. #credit a{
  954. text-decoration: none;
  955. padding: 10px;
  956. background:{color:headerborder};
  957. color: {color:headersubtitle};
  958. }
  959.  
  960.  
  961. #credit a:hover{
  962. text-decoration: none;
  963. background: transparent;
  964. color: {color:headerborder};
  965. -webkit-transition: all 0.4s ease-in-out;
  966. -moz-transition: all 0.4s ease-in-out;
  967. -o-transition: all 0.4s ease-in-out;
  968. -ms-transition: all 0.4s ease-in-out;
  969. transition: all 0.4s ease-in-out;
  970. }
  971.  
  972. </style>
  973. </head>
  974. <body>
  975.  
  976.  
  977.  
  978. <div id="header">
  979.  
  980. <img src="{image:headericon}" /><div id="desc">{Description}</div>
  981.  
  982.  
  983. <div id="head_links">
  984. <a href="/">HOME</a>
  985. <a href="/ask">Message</a>
  986. <a href="/archive">archive</a>
  987. <a href="/submit">submit</a>
  988. <a href="http://themesbyrhass.tumblr.com">THEME</a>
  989. </div>
  990.  
  991. <div id="head_title">
  992. {text:CustomTitle}
  993. <div id="head_subtitle">
  994. {text:CustomTitle2}
  995. </div>
  996. </div>
  997. </div>
  998.  
  999. <div id="sidelinks">
  1000.  
  1001. {block:IfLink1}
  1002. <div class="slinks_circle">
  1003. <a href="{text:Link 1 URL}" class="slinks">{text:Link 1}</a>
  1004. </div>
  1005. {/block:IfLink1}
  1006.  
  1007. {block:IfLink2}
  1008. <div class="slinks_circle">
  1009. <a href="{text:Link 2 URL}" class="slinks">{text:Link 2}</a>
  1010. </div>
  1011. {/block:IfLink2}
  1012.  
  1013. {block:IfLink3}
  1014. <div class="slinks_circle">
  1015. <a href="{text:Link 3 URL}" class="slinks">{text:Link 3}</a>
  1016. </div>
  1017. {/block:IfLink3}
  1018.  
  1019. {block:IfLink4}
  1020. <div class="slinks_circle">
  1021. <a href="{text:Link 4 URL}" class="slinks">{text:Link 4}</a>
  1022. </div>
  1023. {/block:IfLink4}
  1024.  
  1025. {block:IfLink5}
  1026. <div class="slinks_circle">
  1027. <a href="{text:Link 5 URL}" class="slinks">{text:Link 5}</a>
  1028. </div>
  1029. {/block:IfLink5}
  1030.  
  1031.  
  1032. </div><!--navi-->
  1033. {block:pagination}
  1034. <div id="pagination">
  1035.  
  1036. {block:previouspage}
  1037. <a href="{PreviousPage}">
  1038. <span class="pagearrow"><</span></a>
  1039. {/block:previouspage}
  1040. <span class="pages">
  1041. {CurrentPage}/{TotalPages}
  1042. </span>
  1043. {block:nextpage}
  1044. <a href="{NextPage}">
  1045. <span class="pagearrow">></span>
  1046. </a>
  1047. {/block:nextpage}
  1048. </div>
  1049. {/block:pagination}
  1050.  
  1051. <!--- -------------
  1052. BEGIN OF POSTS
  1053. ----------------->
  1054.  
  1055. <div id="container">
  1056. {block:Posts}
  1057. <div id="posts">
  1058.  
  1059.  
  1060. <!---------------- PERMALINK/POST INFO ----------------->
  1061.  
  1062. <div id="perma_date">
  1063. {block:Date}
  1064. <a href="{Permalink}">{MonthNumberWithZero}/{DayOfMonthWithZero}/{ShortYear}</a><br>
  1065. {block:NoteCount}
  1066. {NoteCountWithLabel}
  1067. {/block:NoteCount}
  1068. {/block:Date}
  1069.  
  1070. <div id="via_sou">
  1071. {block:RebloggedFrom}
  1072. <a href="{ReblogParentURL}" title="via {ReblogRootName}">
  1073. <img src="{ReblogParentPortraitURL-40}"></a>
  1074. <br>
  1075. {block:ContentSource}
  1076. <a href="{SourceURL}" title="source">
  1077. <img src="{ReblogRootPortraitURL-40}"></a>
  1078. {block:ContentSource}
  1079. {/block:RebloggedFrom}
  1080. </div>
  1081. </div>
  1082.  
  1083. <!---------------- TEXT POST ----------------->
  1084.  
  1085. {block:Text}
  1086. {block:Title}
  1087. <div id="posttitle">
  1088. {Title}
  1089. </div>
  1090. {/block:Title}
  1091. <div id="caption">
  1092. {Body}
  1093. </div>
  1094.  
  1095. {/block:Text}
  1096.  
  1097. <!---------------- PHOTO & PHOTOSET POST ----------------->
  1098.  
  1099. {block:Photo}
  1100. {LinkOpenTag}
  1101. <img src="{PhotoURL-500}">
  1102. {LinkCloseTag}
  1103. {block:Caption}
  1104. <div id="caption">{Caption}</div>
  1105. {/block:Caption}
  1106. {/block:Photo}
  1107.  
  1108.  
  1109. {block:Photoset}
  1110. {Photoset-500}
  1111. {block:Caption}
  1112. <div id="caption">{Caption}</div>
  1113. {/block:Caption}
  1114. {/block:Photoset}
  1115.  
  1116. <!---------------- VIDEO POST ----------------->
  1117.  
  1118.  
  1119. {block:Video}
  1120. {Video-500}
  1121. {block:Caption}
  1122. <div id="caption">{Caption}</div>
  1123. {/block:Caption}
  1124. {/block:Video}
  1125.  
  1126.  
  1127. <!---------------- QUOTE POST ----------------->
  1128.  
  1129. {block:Quote}
  1130. <div class="quotation">“</div>
  1131. <div class="quote">
  1132. {Quote}
  1133. </div>
  1134.  
  1135. {block:Source}
  1136. <div class="source">
  1137. {Source}
  1138. </div>
  1139. {/block:Source}
  1140. {/block:Quote}
  1141.  
  1142. <!---------------- LINK POST ----------------->
  1143.  
  1144. {block:Link}
  1145. <div id ="linkpost">
  1146. <a href="{URL}">{Name}</a>
  1147. </div>
  1148. {block:Description}
  1149. <div id="caption">
  1150. {Description}
  1151. </div>
  1152. {/block:Description}
  1153. {/block:Link}
  1154.  
  1155. <!---------------- CHAT POST ----------------->
  1156.  
  1157. {block:Chat}
  1158. {block:Title}
  1159. <div class="posttitle">
  1160. {Title}
  1161. </div>
  1162. {/block:Title}
  1163. <div id="chat">
  1164. <hr>
  1165. {block:Lines}
  1166. <div class="c{UserNumber}">
  1167. {block:Label}
  1168. <div id="chatlabel">{Label}&nbsp;&nbsp;</div>
  1169. {/block:Label}
  1170. {Line}<br>
  1171. </div>
  1172. <hr>
  1173. {/block:Lines}
  1174. </div>
  1175.  
  1176.  
  1177. {/block:Chat}
  1178.  
  1179.  
  1180.  
  1181. {block:Audio}
  1182. <div id="audio">
  1183. <div id="player">
  1184. {block:AudioPlayer}
  1185. <div id="player2">
  1186. {AudioPlayerWhite}
  1187. </div>
  1188. {/block:AudioPlayer}
  1189. </div>
  1190. <div id="albumart">
  1191. {block:AlbumArt}
  1192. <img src="{AlbumArtURL}">
  1193. {/block:AlbumArt}
  1194. </div>
  1195.  
  1196. <div id="albuminfotitle">
  1197. {block:TrackName}
  1198. {TrackName}
  1199. {/block:TrackName}
  1200. </div>
  1201. <div id="alinfo">
  1202. {block:Artist} by {Artist}
  1203. {/block:Artist}
  1204. <br>
  1205. {block:Album}
  1206. {Album}
  1207. {/block:Album}
  1208. {block:PlayCount} with {PlayCountWithLabel}
  1209. {/block:PlayCount}</div>
  1210. </div>
  1211.  
  1212. {block:Caption}
  1213. <div id="caption">{Caption}</div>
  1214. {/block:Caption}
  1215. {/block:Audio}
  1216.  
  1217. <!---------------- TUMBLR ASK ----------------->
  1218.  
  1219. {block:Answer}
  1220. <div class="question">
  1221. {Asker}: {Question}</div>
  1222. <center>
  1223. <img src="{AskerPortraitURL-24}" align="center" style="display: inline-blcok; margin-top:-20px;border: 5px solid {color:headerborder};" >
  1224. </center>
  1225. <div id="caption">{Answer}</div>
  1226. {/block:Answer}
  1227.  
  1228. <!--------------- TAGS ------------------------>
  1229.  
  1230. {block:HasTags}
  1231.  
  1232. <div id="tags">
  1233. tagged with:
  1234. {block:Tags}
  1235. <a class="tagged" href="{TagURL}">+{Tag}</a>
  1236. {/block:Tags}
  1237. </div>
  1238. {/block:HasTags}
  1239.  
  1240. <div class="note">
  1241. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1242. </div>
  1243.  
  1244. </div>
  1245.  
  1246.  
  1247. {/block:Posts}
  1248.  
  1249. <div id="credit">
  1250. <a href="http://themesbyrhass.tumblr.com">TBR</a>
  1251. </div>
  1252.  
  1253.  
  1254.  
  1255.  
  1256. </body>
  1257. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!