API tools faq
paste
Advertisement
cocoofrps

THEME 12 'BY THE MOONLIGHT'

cocoofrps
Feb 1st, 2014
770
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.50 KB | None | 0 0
raw download clone embed print report
  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. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  4. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  5. <script>
  6. (function($){
  7. $(document).ready(function(){
  8. $("[title]").style_my_tooltips({
  9. tip_follows_cursor:true,
  10. tip_delay_time:200,
  11. tip_fade_speed:300
  12. }
  13. );
  14. });
  15. })(jQuery);
  16. </script>
  17.  
  18. <head><title>{Title}</title>
  19.  
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  23.  
  24. <!--- THEME BY @cocoofrps --->
  25.  
  26. <meta name="color:Background" content="#121a2d"/>
  27. <meta name="color:Text" content="#0f182a"/>
  28. <meta name="color:PostBG" content="#3c334a"/>
  29. <meta name="color:SidebarBorder" content="#3b334a" />
  30. <meta name="color:Border" content="#877866"/>
  31. <meta name="color:Hover" content="#7e615e"/>
  32. <meta name="color:Scrollbar" content="#877866"/>
  33. <meta name="color:ScrollbarBg" content="#0f182a"/>
  34. <meta name="color:Post Links" content="#0f182a"/>
  35. <meta name="color:DescriptionText" content="#7e615e"/>
  36.  
  37. <meta name="image:Background" content=""/>
  38. <meta name="image:Image One" content=""/>
  39. <meta name="image:Image Two" content=""/>
  40. <meta name="image:Image Three" content=""/>
  41. <meta name="image:PNG" content=""/>
  42.  
  43. <meta name="image:link1" content=""/>
  44. <meta name="image:link2" content=""/>
  45. <meta name="image:link3" content=""/>
  46.  
  47. <meta name="text:link1" content=""/>
  48. <meta name="text:link2" content=""/>
  49. <meta name="text:link3" content=""/>
  50. <meta name="text:link1 name" content=""/>
  51. <meta name="text:link2 name" content=""/>
  52. <meta name="text:link3 name" content=""/>
  53.  
  54. <meta name="if:CoverBackgroundImage" content="0"/>
  55.  
  56. <style type="text/css">
  57.  
  58. ::-webkit-scrollbar-thumb {
  59. height:auto;
  60. border:{color:ScrollbarBg};
  61. border:1px solid {color:ScrollbarBg};
  62. background-color:{color:Scrollbar};
  63. }
  64.  
  65. ::-webkit-scrollbar {
  66. height:9px;
  67. width:5px;
  68. background-color:{color:ScrollbarBg};
  69. }
  70.  
  71. ::selection {
  72. background: {color:Background};
  73. color: {color:PostBG};
  74. }
  75.  
  76. ::-moz-selection {
  77. background: {color:Background};
  78. color: {color:PostBG};
  79. }
  80.  
  81. ::-webkit-selection {
  82. background: {color:Background};
  83. color: {color:PostBG};
  84. }
  85.  
  86. body {
  87. border-top:3px solid {color:Border};
  88. overflow-y:scroll;
  89. background:{color:Background};
  90. margin:0px;
  91. color:{color:Text};
  92. font-family:'arial';
  93. font-size:11px;
  94. line-height:100%;
  95. letter-spacing:1px;
  96. text-align:justify;
  97. {block:ifNotCoverBackgroundImage}
  98. background-image:url('{image:Background}');
  99. background-attachment:fixed;
  100. {block:ifNotCoverBackgroundImage}
  101. {block:IfCoverBackgroundImage}
  102. background: url('{image:Background}') no-repeat center center fixed;
  103. -webkit-background-size: cover;
  104. -moz-background-size: cover;
  105. -o-background-size: cover;
  106. background-size: cover;
  107. {block:IfCoverBackgroundImage}
  108. }
  109.  
  110. small,big {
  111.  
  112. }
  113. a {
  114. text-decoration:none;
  115. outline:none;
  116. font-weight:400;
  117. -moz-outline-style:none;
  118. color:{color:Post Links};
  119. }
  120.  
  121. b {
  122. color:{color:border};
  123. font-weight:100;
  124. }
  125.  
  126. a:hover {
  127. color:{color:Hover};
  128. -webkit-transition: all 0.4s ease-in-out;
  129. -moz-transition: all 0.4s ease-in-out;
  130. -o-transition: all 0.4s ease-in-out;
  131. -ms-transition: all 0.4s ease-in-out;
  132. transition: all 0.4s ease-in-out;
  133. }
  134.  
  135. img {
  136. border:none;
  137. }
  138.  
  139. blockquote {
  140. margin-left:5px;
  141. padding-left:5px;
  142. border-left:2px solid;
  143. }
  144.  
  145. blockquote blockquote {
  146. padding-left:5px;
  147. border-left:2px solid;
  148. }
  149.  
  150. h1 {
  151. font-size:11px;
  152. letter-spacing:2px;
  153. text-transform:uppercase;
  154. font-style:none;
  155. line-height:10px;
  156. text-align:center;
  157. padding:0px;
  158. }
  159.  
  160. /*ENTRIES*/
  161.  
  162. #entries {
  163. width:500px;
  164. position:absolute;
  165. margin-left:600px;
  166. margin-top:30px;
  167. font-size:11px;
  168. z-index:99999000;
  169. letter-spacing:0px;
  170. }
  171.  
  172. #post {
  173. background-color:{color:PostBG};
  174. width:500px;
  175. box-shadow:0px 10px 0px {color:SidebarBorder};
  176. padding-bottom:20px;
  177. padding:20px;
  178. border:2px solid {color:Border};
  179. margin-top:10px;
  180. }
  181.  
  182. /*SIDEBAR*/
  183. #sidebar {
  184. position:fixed;
  185. width:200px;
  186. margin-left:0px;
  187. }
  188.  
  189. #png img {
  190. position:fixed;
  191. margin-left:400px;
  192. height:300px;
  193. margin-top:86px;
  194. z-index:99990000;
  195. width:150px;
  196. }
  197.  
  198. #sidebarimage {
  199. margin-top:70px;
  200. height:100px;
  201. margin-left:50px;
  202. position:fixed;
  203. width:100px;
  204. }
  205.  
  206. #sidebarimage img{
  207. width:350px;
  208. border:2px solid {color:SidebarBorder};
  209. background-color:{color:PostBG};
  210. height:145px;
  211. z-index:-10000;
  212. position:fixed;
  213. margin-top:10px;
  214. -webkit-transition: all 0.5s ease;
  215. -moz-transition: all 0.5s ease;
  216. -o-transition: all 0.5s ease;
  217. transition: all 0.5s ease;
  218. }
  219.  
  220. #two img {
  221. margin-left:160px;
  222. margin-top:169px;
  223. }
  224.  
  225. #three img {
  226. position:fixed;
  227. border:2px solid {color:SidebarBorder};
  228. margin-left:50px;
  229. height:145px;
  230. width:145px;
  231. margin-top:239px;
  232. }
  233.  
  234.  
  235. #desc {
  236. margin-top:532px;
  237. overflow-y:auto;
  238. border:2px solid {color:Border};
  239. width:350px;
  240. margin-left:120px;
  241. z-index:-1;
  242. height:80px;
  243. color:{color:DescriptionText};
  244. background-color:{color:PostBG};
  245. position:fixed;
  246. padding:10px;
  247. }
  248.  
  249. #desc p {
  250. padding:5px;
  251. text-align:justify;
  252. }
  253.  
  254. #desc big {
  255. background-color:{color:Background};
  256. margin-top:10px;
  257. padding:5px;
  258. }
  259.  
  260. .links{
  261. position:fixed;
  262. display:block;
  263. margin-left:125px;
  264. width:600px;
  265. margin-top:410px;
  266. z-index:999;
  267. }
  268.  
  269.  
  270. .links img{
  271. margin-bottom:0px;
  272. margin-right:3px;
  273. -webkit-transition: all 0.4s ease-in-out;
  274. -moz-transition: all 0.4s ease-in-out;
  275. -o-transition: all 0.4s ease-in-out;
  276. -ms-transition: all 0.4s ease-in-out;
  277. transition: all 0.4s ease-in-out;
  278. }
  279.  
  280. .links img:hover {
  281. -webkit-transition: all 0.4s ease-in-out;
  282. -moz-transition: all 0.4s ease-in-out;
  283. -o-transition: all 0.4s ease-in-out;
  284. -ms-transition: all 0.4s ease-in-out;
  285. transition: all 0.4s ease-in-out;
  286. }
  287.  
  288. img.blur:hover {
  289. -webkit-filter: brightness(120%);
  290. -moz-filter: brightness(120%);
  291. -o-filter: brightness(120%);
  292. -ms-filter: brightness(120%);
  293. filter: brightness(120%);
  294. }
  295.  
  296. #pagination {
  297. position:fixed;
  298. padding:5px;
  299. width:360px;
  300. z-index:99000000;
  301. text-align:center;
  302. border:2px solid {color:Border};
  303. margin-top:637px;
  304. margin-left:120px;
  305. background-color:{color:SidebarBorder};
  306. }
  307.  
  308. #pagination a{
  309. font-style:bold;
  310. font-style:italic;
  311. letter-spacing:2px;
  312. font-size:6px;
  313. padding:5px;
  314. color:{color:DescriptionText};
  315. text-align:center;
  316. text-transform:uppercase;
  317. z-index:-111;
  318. -webkit-transition: all 0.4s ease-in-out;
  319. -moz-transition: all 0.4s ease-in-out;
  320. -o-transition: all 0.4s ease-in-out;
  321. -ms-transition: all 0.4s ease-in-out;
  322. transition: all 0.4s ease-in-out;
  323. }
  324.  
  325. #pagination a:hover {
  326. color:{color:Background};
  327. -webkit-transition: all 0.4s ease-in-out;
  328. -moz-transition: all 0.4s ease-in-out;
  329. -o-transition: all 0.4s ease-in-out;
  330. -ms-transition: all 0.4s ease-in-out;
  331. transition: all 0.4s ease-in-out;
  332. }
  333.  
  334.  
  335. /*AUDIO INFO*/
  336.  
  337. .playerbuttonbg {
  338. position: absolute;
  339. left: 15px;
  340. top: 15px;
  341. width: 30px;
  342. height: 30px;
  343. background-color: #ffffff;
  344. padding: 10px;
  345. opacity: .4;
  346. filter: alpha(opacity=40);
  347. -moz-opacity: 0.4;
  348. -khtml-opacity: 0.4;
  349. transition: opacity .7s ease-in-out;
  350. -moz-transition: opacity .7s ease-in-out;
  351. -webkit-transition: opacity .7s ease-in-out;
  352. }
  353.  
  354. .playerbuttonbg:hover {
  355. opacity: 1;
  356. filter: alpha(opacity=100);
  357. -moz-opacity: 1;
  358. -khtml-opacity: 1;
  359. }
  360.  
  361. .newplayerbutton {
  362. position: relative;
  363. width:30px;
  364. height:30px;
  365. margin-top:-4px;
  366. overflow: hidden;
  367. }
  368.  
  369. .playerbuttonhug {
  370. position: absolute;
  371. top: -25px;
  372. left: -10px;
  373. }
  374.  
  375. .tumblr_audio_player {
  376. height: 90px;
  377. width: 270px;
  378.  
  379. -moz-transform-origin: top left;
  380. -webkit-transform-origin: top left;
  381. -o-transform-origin: top left;
  382. -ms-transform-origin: top left;
  383. transform-origin: top left;
  384. }
  385.  
  386. .audioimgwrapper {
  387. position: absolute;
  388. left: 0px;
  389. top: 0px;
  390. overflow: hidden;
  391. width: 79px;
  392. height: 79px;
  393. }
  394.  
  395. .audioimgwrapper img {
  396. width: 100%;
  397. height: auto;
  398. }
  399.  
  400. .trackdetails {
  401. text-transform:uppercase;
  402. width: auto;
  403. display:inline-block;
  404. margin-top:23px;
  405. margin-left: 90px;
  406. min-height: 85px;
  407. }
  408.  
  409. .audiowrapper {
  410. position: relative;
  411. display:inline-block;
  412. }
  413.  
  414. /*POST INFO*/
  415.  
  416. #info {
  417. text-align:right;
  418. font-family:'helvetica';
  419. letter-spacing:1px;
  420. font-size:7px;
  421. font-style:none;
  422. line-height:10px;
  423. text-transform:uppercase;
  424. padding:5px;
  425. background-color:{color:Background};
  426. border-color:{color:Border};
  427. }
  428.  
  429. #info a {
  430. text-align:right;
  431. color:{color:PostBG};
  432. }
  433.  
  434. #info a:hover {
  435. -moz-transition-duration:0.3s;
  436. -webkit-transition-duration:0.3s;
  437. -o-transition-duration:0.3s;
  438. color:{color:Hover}
  439. }
  440.  
  441. #tags {
  442. margin-top:4px;
  443. width:500px;
  444. text-align:right;
  445. font-size:8px;
  446. margin-left:-5px;
  447. font-family:'arial';
  448. opacity:1;
  449. padding:0px;
  450. text-transform:lowercase;
  451. transition-duration: 0.5s;
  452. -moz-transition-duration: 0.5s;
  453. -webkit-transition-duration: 0.5s;
  454. -o-transition-duration: 0.5s
  455. color:{color:Post Links};
  456. background-color:{color:Border};
  457. }
  458.  
  459. #tags a {
  460. padding:5px;
  461. letter-spacing:0px;
  462. font-family:'helvetica';
  463. text-decoration:none;
  464. display:inline-block;
  465. }
  466.  
  467. #tags a:hover {
  468. -moz-transition-duration:0.3s;
  469. -webkit-transition-duration:0.3s;
  470. -o-transition-duration:0.3s;
  471. color:{color:Hover};
  472. }
  473.  
  474. /*QUESTION*/
  475.  
  476. #asker {
  477. padding:14px;
  478. font-size:11px;
  479. letter-spacing:0px;
  480. text-align:left;
  481. margin-top:0px;
  482. border:2px solid {color:Border};
  483. text-transform:lowercase;
  484. line-height:100%;
  485. }
  486.  
  487. #q {
  488. border:2px solid {color:Border};
  489. -webkit-border-radius: 5px;
  490. -moz-border-radius: 5px;
  491. -o-border-radius: 5px;
  492. -ms-border-radius: 5px;
  493. border-radius: 5px;
  494. }
  495.  
  496. /*CREDIT*/
  497.  
  498. #cred {
  499. position:fixed;
  500. font-family:'helvetica';
  501. text-transform:uppercase;
  502. font-size:20px;
  503. background-color:{color:PostBG};
  504. right:9px;
  505. bottom:9px;
  506. padding:5px;
  507. padding-bottom:11px;
  508. border:2px solid {color:Background};
  509. letter-spacing:1px;
  510. }
  511.  
  512. #notes {
  513. font-family:helvetica;
  514. text-transform:uppercase;
  515. }
  516.  
  517. #notes li{
  518. list-style-type:none;
  519. background-color:{color:PostBG};
  520. padding:6px;
  521. }
  522.  
  523. #notes img {
  524. opacity:0;
  525. }
  526.  
  527. #s-m-t-tooltip{
  528. position:absolute;
  529. background-color:{color:PostBG};
  530. padding:3px;
  531. z-index:9999;
  532. border:2px solid {color:DescriptionText};
  533. margin-top:-10px;
  534. margin-left:5px;
  535. display:block;
  536. text-transform:uppercase;
  537. font-size:8px;
  538. color:{color:text};
  539. }
  540.  
  541.  
  542. {CustomCSS}</style>
  543. </head><body>
  544. <div id="sidebar">
  545. <div id="sidebarimage">
  546. <img src="{image:Image One}">
  547. <div id="two"><img src="{image:Image Two}"></div>
  548. </div>
  549. <div id="three"><img src="{image:Image Three}"></div>
  550. <div id="png"><img src="{image:PNG}"></div>
  551. <div id="desc"><br/><big>{Title}</big><p>{Description}</p></div>
  552. <div class="links">
  553. <a href="{text:link1}" title="refresh"><img src="{image:link1}" class="blur"></a>
  554. <a href="{text:link2}" title="ask"><img src="{image:link2}" class="blur"></a>
  555. <a href="{text:link3}" title="navi"><img src="{image:link3}" class="blur"></a>
  556. </div>
  557. </div>
  558. {block:Pagination}
  559. <div id="pagination">
  560. {block:PreviousPage}<a href="{PreviousPage}" title="back"><big>PREV</big> // </a>{/block:PreviousPage}
  561. {block:NextPage}<a href="{NextPage}" title="next"><big> NEXT</big></a>{/block:NextPage}
  562. </div>
  563. {/block:Pagination}
  564.  
  565.  
  566. <div id="entries">
  567. {block:Posts}
  568. <div id="post">
  569.  
  570. {block:Text}
  571. <h1>{block:Title}<a href="{Permalink}" title="{Title}"><div style="width:490px;font-size:10px;font-family:'courier new';text-tranform:uppercase;padding:5px;background-color:{color:Border};color:{color:PostBG};">{Title}</div></a>{/block:Title}</h1>
  572. {Body}<br>{/block:Text}
  573.  
  574. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  575. {block:Caption}{Caption}{/block:Caption}<br>{/block:Photo}
  576.  
  577. {block:Photoset}{Photoset-500}{block:Caption}{Caption}
  578. {/block:Caption}<br>{/block:Photoset}
  579.  
  580. {block:Quote}<div style="width:490px;font-size:11px;padding:5px;background-color:{color:Border};color:{color:PostBG};">"{Quote}"</div><br/>
  581. {block:Source}<div class="qsource"> —{Source}</div>
  582. {/block:Source}<br>{/block:Quote}
  583.  
  584. {block:Link}<a href="{URL}" {Target} title="{Name}"><div style="width:490px;font-size:11px;padding:5px;font-family:'courier new';background-color:{color:Border};color:{color:PostBG};">{Name}</div></a>{block:Description}{Description}{/block:Description}<br>{/block:Link}
  585.  
  586. {block:Chat}{block:Title}{Title}{/block:Title}{block:Lines}{block:Label}<span style="font-size:15px;text-transform:uppercase;"><b>{Label}</b></span>{/block:Label} {Line}<br>{/block:Lines}<br>{/block:Chat}
  587.  
  588. {block:AudioPlayer}<div class="audiowrapper">{block:AlbumArt}<div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>{/block:AlbumArt} <div class="playerbuttonbg"><div class="newplayerbutton"><div class="playerbuttonhug">{AudioPlayerWhite}</div></div></div><div class="trackdetails">{block:TrackName}{TrackName}{/block:TrackName}<br/>{block:Artist}{Artist}{/block:Artist}<br/>{block:Album}{Album}{/block:Album}<br/></div></div>{block:Caption}{Caption}{/block:Caption}{/block:AudioPlayer}
  589.  
  590.  
  591. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}<br>{/block:Video}
  592.  
  593. <!--- Please don't steal anything. I find it rude and unethical. -->
  594. {block:Answer}<div id="asker"><span style="text-transform:uppercase;color:{color:Post Links};letter-spacing:2px;">{Asker}:</span></br>{Question}</div>{block:Answerer}</br><div style="padding:14px;border:2px solid {color:Border};padding-top:17px;padding-bottom:2px;"><span style="text-transform:uppercase;letter-spacing:2px;">{Answerer}:</span><div style="margin-top:-10px;">{Answer}</div></div>{/block:Answerer}{Replies}</br>{/block:Answer}
  595.  
  596. <div id="info">
  597. <a href="{Permalink}" title="Permalink">{TimeAgo}</a>
  598. {block:NoteCount}
  599. | <a href="{Permalink}">{NoteCountWithLabel}{/block:NoteCount}</a>{block:RebloggedFrom} | <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom} {block:ContentSource} |
  600. <a href="{SourceURL}" title="Source">source</a>{/block:ContentSource}
  601. {block:RebloggedFrom} <a href="{ReblogParentURL}" title="Reblogged From" target="_blank"></a>{/block:RebloggedFrom}
  602. {block:HasTags}<div id="tags">
  603. {block:Tags} <a href="/tagged/{Tag}">#{Tag}</a>{/block:Tags}
  604. </div>{block:HasTags}
  605. </div>
  606. </div>
  607. {/block:Posts}
  608. <br><br>{block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}
  609. {/block:Posts}</div></div></div>
  610. <br><br><br><br>
  611.  
  612. <div id="cred">
  613. <a href="http://cocoofrps.tumblr.com/" title="THEME 12 BY COCO">♚</a>
  614. </div>
  615. </div>
  616.  
  617.  
  618.  
  619. </body>
  620.  
  621. </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!