API tools faq
paste
trenzalours

BOTM theme - ragharok

trenzalours
Sep 6th, 2014
343
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.93 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4.  
  5. <title>{Title}</title>
  6.  
  7. <link rel="shortcut icon" href="{favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10. <link href='http://fonts.googleapis.com/css?family=Alegreya+Sans+SC:400,700' rel='stylesheet' type='text/css'>
  11. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  12.  
  13. <!-- ᴄᴜsᴛᴏᴍ ᴛʜᴇᴍᴇ
  14. ғᴏʀ ʀᴀɢʜᴀʀᴏᴋ ʙʏ ᴛʀᴇɴᴢᴀᴛʜᴇᴍᴇs
  15. ᴅᴏɴ·ᴛ sᴛᴇᴀʟ ɪᴛs ɴᴏᴛ ᴄʜɪʟʟ
  16. -->
  17.  
  18. <meta name="image:Background Image" content="http://static.tumblr.com/3dkvxpf/yFjn941og/tumblr_mx3toqf8vu1st5lhmo1_1280.jpg"/>
  19.  
  20. <meta name="select:Background image" content="bg-none" title="None">
  21. <meta name="select:Background image" content="bg-cover"
  22. title="Full screen">
  23. <meta name="select:Background image" content="bg-pattern"
  24. title="Pattern">
  25. <meta name="select:Background image" content="bg-gradient"
  26. title="Gradient">
  27.  
  28. <meta name="color:Background" content="#ffffff"/>
  29. <meta name="color:Title" content="#ffffff"/>
  30. <meta name="color:Text" content="#aaaaaa"/>
  31. <meta name="color:Link" content="#000000"/>
  32. <meta name="color:Hover" content="#ffffff"/>
  33. <meta name="color:Borders" content="#aaaaaa"/>
  34. <meta name="color:Scrollbar" content="#000000"/>
  35. <meta name="color:Accent" content="#ffffff"/>
  36. <meta name="color:Gradient 1" content="#eeeeee"/>
  37. <meta name="color:Gradient 2" content="#b8b8b8"/>
  38.  
  39. <meta name="if:Header" content="1">
  40. <meta name="if:Thick Borders" content="0">
  41. <meta name="if:400px" content="1">
  42. <meta name="if:ShowLink4" content="0">
  43. <meta name="if:ShowLink5" content="0">
  44. <meta name="if:Post Shadow" content="0">
  45.  
  46. <meta name="text:FAQ" content="Type out your FAQ here!">
  47. <meta name="text:Tumblr Url" content="example.tumblr.com">
  48.  
  49. <meta name="text:Link 1 URL" content="" />
  50. <meta name="text:Link 1" content="" />
  51. <meta name="text:Link 2 URL" content="" />
  52. <meta name="text:Link 2" content="" />
  53. <meta name="text:Link 3 URL" content="" />
  54. <meta name="text:Link 3" content="" />
  55. <meta name="text:Link 4 URL" content="" />
  56. <meta name="text:Link 4" content="" />
  57. <meta name="text:Link 5 URL" content="" />
  58. <meta name="text:Link 5" content="" />
  59.  
  60.  
  61.  
  62. <!--side push menu from codrops-->
  63. <!--don't touch-->
  64. <script src="http://takien.github.io/jPushMenu/js/jquery-1.9.1.min.js"></script>
  65. <script src="http://takien.github.io/jPushMenu/js/jPushMenu.js"></script>
  66.  
  67. <!--call jPushMenu, required-->
  68. <script>
  69. jQuery(document).ready(function($) {
  70. $('.toggle').jPushMenu();
  71. });
  72. </script>
  73.  
  74. <!-- jquery for tooltips-->
  75. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  76.  
  77. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  78.  
  79. <script>
  80.  
  81. (function($){
  82.  
  83. $(document).ready(function(){
  84.  
  85. $("a[title]").style_my_tooltips({
  86.  
  87. tip_follows_cursor:true,
  88.  
  89. tip_delay_time:30,
  90.  
  91. tip_fade_speed:300,
  92.  
  93. attribute:"title"
  94.  
  95. });
  96.  
  97. });
  98.  
  99. })(jQuery);
  100.  
  101. </script>
  102.  
  103. <!--CSS customization here. -->
  104.  
  105. <style type="text/css">
  106.  
  107.  
  108.  
  109. *, #nav a:hover {
  110. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  111. }
  112.  
  113. *, #tops a:hover {
  114. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  115. }
  116.  
  117. *, body a:hover {
  118. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  119. }
  120.  
  121. #s-m-t-tooltip{
  122. padding:4px 9px;
  123. position:absolute;
  124. margin: 10px 20px;
  125. padding:5px;
  126. font-size:10px;
  127. font-family: 'Alegreya Sans SC', sans-serif;
  128. z-index: 99999999999;
  129. letter-spacing:1px;
  130. text-transform:lowercase;
  131. background:{color:background};
  132. }
  133.  
  134. /* SELECTION */
  135.  
  136. ::selection {
  137. background-color:{color:accent};
  138. color:black;}
  139.  
  140. ::-webkit-scrollbar{width: 6px;}
  141. ::-webkit-scrollbar-thumb{
  142. border:1px solid {color:scrollbar};
  143. opacity:0.3;
  144. }
  145. ::-webkit-scrollbar-track {
  146. background: rgba(255, 255, 255, 0.3);}
  147.  
  148. /* END CSS Code for Scrollbar END */
  149.  
  150. /*basics*/
  151. blockquote {padding:5px 0 5px 30px;
  152. border-left:1px solid {color:text};
  153. margin-left:30px;
  154. }
  155.  
  156. body {
  157. background:{color:background};
  158. color:{color:text};
  159. font-family:sans-serif;
  160. font-size:10px;
  161. letter-spacing:1px;
  162. text-align:justify;
  163. margin:0;
  164. line-height:1.3em;}
  165.  
  166.  
  167. .bg-none{background:{color:background};}
  168.  
  169. .bg-cover {
  170. background: url({image:Background Image})
  171. no-repeat center center fixed;
  172. -webkit-background-size: cover;
  173. -moz-background-size: cover;
  174. -o-background-size: cover;
  175. background-size: cover;}
  176.  
  177. .bg-pattern {
  178. background: url({image:Background Image});
  179. background-repeat:repeat;
  180. background-attachment: fixed; }
  181.  
  182. .bg-gradient {
  183. background: {color:Gradient 1}; /* Old browsers */
  184. background: -moz-linear-gradient(top, {color:Gradient 1} 0%, {color:Gradient 2} 100%); /* FF3.6+ */
  185. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,{color:Gradient 1}), color-stop(100%,{color:Gradient 2})); /* Chrome,Safari4+ */
  186. background: -webkit-linear-gradient(top, {color:Gradient 1} 0%,{color:Gradient 2} 100%); /* Chrome10+,Safari5.1+ */
  187. background: -o-linear-gradient(top, {color:Gradient 1} 0%,{color:Gradient 2} 100%); /* Opera 11.10+ */
  188. background: -ms-linear-gradient(top, {color:Gradient 1} 0%,{color:Gradient 2} 100%); /* IE10+ */
  189. background: linear-gradient(to bottom, {color:Gradient 1} 0%,{color:Gradient 2} 100%); /* W3C */
  190. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='{color:Gradient 1}', endColorstr='{color:Gradient 2}',GradientType=0 ); /* IE6-9 */
  191. background-attachment: fixed;
  192. }
  193.  
  194.  
  195.  
  196. a {
  197. color:{color:accent};
  198. text-decoration:none;
  199. -webkit-transition: all 1s ease;
  200. -moz-transition: all 1s ease;
  201. -o-transition: all 1s ease;
  202. -ms-transition: all 1s ease;
  203. transition: all 1s ease;
  204. }
  205.  
  206. a:hover {
  207. color:{color:hover};
  208. text-decoration:none;
  209. text-shadow: 1px 0 .1px {color:accent}, 0px 0 .1px {color:hover};
  210. -webkit-transition: all 1s ease;
  211. -moz-transition: all 1s ease;
  212. -o-transition: all 1s ease;
  213. -ms-transition: all 1s ease;
  214. transition: all 1s ease;
  215. }
  216.  
  217. img{opacity:1;
  218. border:none;
  219. text-decoration:none}
  220.  
  221.  
  222. small {
  223. font-size:10px;}
  224.  
  225. big {
  226. font-size:12px;}
  227.  
  228. pre{
  229. background:{color:background};
  230. padding:10px;
  231. color:{color:text};
  232. font-family:arial;
  233. text-transform:uppercase;
  234. border-bottom:1px solid {color:borders};
  235. font-size:10px;
  236. letter-spacing:1px;
  237. white-space: pre-wrap;
  238. white-space: -moz-pre-wrap;
  239. white-space: -pre-wrap;
  240. white-space: -o-pre-wrap;
  241. word-wrap: break-word;}
  242.  
  243. code{
  244. text-transform:lowercase;
  245. font-style:italic;
  246. }
  247.  
  248. b,strong{
  249. color:{color:accent};
  250. font-weight:bold;
  251. }
  252. em,i{
  253. color:{color:accent};
  254. font-style:italic;
  255. }
  256.  
  257.  
  258. strike{
  259. text-decoration: line-through;
  260. }
  261.  
  262.  
  263. #title {font-size:12px;
  264. line-height:1.4em;
  265. margin-bottom:10px;
  266. text-transform:uppercase;
  267. text-align:left;
  268. font-family: 'Alegreya Sans SC', sans-serif;
  269. }
  270.  
  271.  
  272. /*sidebar*/
  273. {block:ifHeader}
  274. header {
  275. text-align: center;
  276. color:{color:text};
  277. margin-bottom:50px;
  278. }
  279.  
  280. header::after {
  281. content: '';
  282. display: inline-block;
  283. width: 100%;
  284. }
  285.  
  286. header h1,
  287. header nav {
  288. display: inline-block;
  289. vertical-align: center;
  290. }
  291.  
  292. header h1 {
  293. font-family: 'Alegreya Sans SC', sans-serif;
  294. text-align: center;
  295. padding-top: 0.5em;
  296. {block:ifnotThickBorders}
  297. border:1px solid {color:borders};
  298. {/block:ifnotThickBorders}
  299. {block:ifThickBorders}
  300. border:3px solid {color:borders};
  301. {/block:ifThickBorders}
  302. padding:12px;
  303. font-size:23px;
  304. text-transform:lowercase;
  305. background:{color:background};
  306.  
  307. }
  308. header h1 a{
  309. color:{color:title};
  310. -webkit-transition: all 1s ease;
  311. -moz-transition: all 1s ease;
  312. -o-transition: all 1s ease;
  313. -ms-transition: all 1s ease;
  314. transition: all 1s ease;
  315. }
  316. header h1 a:hover{
  317. text-decoration:none;
  318. color:{color:title};
  319. text-shadow: 2px 0px 2px {color:hover};
  320. -webkit-transition: all 1s ease;
  321. -moz-transition: all 1s ease;
  322. -o-transition: all 1s ease;
  323. -ms-transition: all 1s ease;
  324. transition: all 1s ease;
  325. }
  326.  
  327. header nav {
  328. text-align:center;
  329. word-spacing:1px;
  330. width:210px;
  331. }
  332.  
  333. header nav a{
  334. -webkit-transition: all 1s ease;
  335. -moz-transition: all 1s ease;
  336. -o-transition: all 1s ease;
  337. -ms-transition: all 1s ease;
  338. transition: all 1s ease;
  339. }
  340. header nav a:hover{
  341. -webkit-transition: all 1s ease;
  342. -moz-transition: all 1s ease;
  343. -o-transition: all 1s ease;
  344. -ms-transition: all 1s ease;
  345. transition: all 1s ease;}
  346. .uno{
  347. display:inline-block;
  348. word-spacing:5px;
  349. {block:ifnotShowLink4}
  350. margin-left:-10px;
  351. {/block:ifnotShowLink4}
  352. {block:ifnotShowLink5}
  353. margin-left:-10px;
  354. {/block:ifnotShowLink5}
  355. {block:ifShowLink5}
  356. margin-left:-16px;
  357. {/block:ifShowLink5}
  358. }
  359.  
  360.  
  361. .uno a{
  362. display:inline-block;
  363. padding:4px;
  364. border-radius:100px;
  365. background:{color:background};
  366. {block:ifnotThickBorders}
  367. border:1px solid {color:borders};
  368. {/block:ifnotThickBorders}
  369. {block:ifThickBorders}
  370. border:2px solid {color:borders};
  371. {/block:ifThickBorders}
  372. }
  373. .uno a:hover{
  374. background:{color:background};
  375. opacity:.7;
  376. {block:ifnotThickBorders}
  377. border:1px solid {color:hover};
  378. {/block:ifnotThickBorders}
  379. {block:ifThickBorders}
  380. border:2px solid {color:hover};
  381. {/block:ifThickBorders}
  382. }
  383.  
  384.  
  385.  
  386. .content{
  387. width:150px;
  388. opacity:0;
  389. left: 50%;
  390. {block:if400px}
  391. margin-left: -498px;
  392. {/block:if400px}
  393. {block:ifnot400px}
  394. margin-left: -400px;
  395. {/block:ifnot400px}
  396. top:23%;
  397. text-align:center;}
  398.  
  399. .stars{
  400. top:0px;
  401. opacity:0px;
  402.  
  403. }
  404.  
  405. .cool2{
  406. margin-top:-10px;
  407. opacity:1;
  408. }
  409.  
  410. .cool {
  411. opacity:1;
  412. position:fixed;
  413. text-align:center;
  414. -webkit-transition:0.5s;
  415. -moz-transition:0.5s;
  416. -ms-transition:0.5s;
  417. -o-transition:0.5s;
  418. transition:0.5s;
  419. }
  420.  
  421. .cool {
  422. opacity:1;
  423. position:fixed;
  424. text-align:center;
  425. -webkit-transition:0.5s;
  426. -moz-transition:0.5s;
  427. -ms-transition:0.5s;
  428. -o-transition:0.5s;
  429. transition:0.5s;
  430. }
  431. {/block:ifHeader}
  432.  
  433. .sidebar{
  434. {block:ifnotHeader}
  435. left: 50%;
  436. {block:if400px}
  437. margin-left: -498px;
  438. {/block:if400px}
  439. {block:ifnot400px}
  440. margin-left: -400px;
  441. {/block:ifnot400px}
  442. top:23%;
  443. position:fixed;
  444. {/block:ifnotHeader}
  445. width:150px;
  446. background:transparent;
  447. padding:10px;
  448. }
  449.  
  450. .btitle{
  451. text-align:center;
  452. font-size:24px;
  453. font-family: 'Alegreya Sans SC', sans-serif;
  454. {block:ifnotThickBorders}
  455. border:1px solid {color:borders};
  456. {/block:ifnotThickBorders}
  457. {block:ifThickBorders}
  458. border:3px solid {color:borders};
  459. {/block:ifThickBorders}
  460. font-weight:bold;
  461. color:{color:title};
  462. background:{color:background};
  463. padding:10px;
  464. line-height:1.3em;
  465. }
  466. .btitle a{
  467. color:{color:title};
  468. }
  469. .btitle a:hover{
  470. text-decoration:none;
  471. color:{color:title};
  472. text-shadow: 2px 0px 7px {color:title};
  473. -webkit-transition: all 1s ease;
  474. -moz-transition: all 1s ease;
  475. -o-transition: all 1s ease;
  476. -ms-transition: all 1s ease;
  477. transition: all 1s ease;
  478. }
  479. .descript{
  480. margin-top:8px;
  481. padding:10px;
  482. {block:ifnotThickBorders}
  483. border:1px solid {color:borders};
  484. {/block:ifnotThickBorders}
  485. {block:ifThickBorders}
  486. border:2px solid {color:borders};
  487. {/block:ifThickBorders}
  488. background:{color:background};
  489. line-height:1.3em;
  490. font-size:9px;
  491. word-spacing:2px;
  492. text-align:center;
  493. }
  494. .nav-link{
  495. display:inline-block;
  496. text-align:center;
  497. margin-top:10px;
  498. width:150px;
  499. word-spacing:5px;
  500. {block:ifHeader}
  501. margin-left:-20px;
  502. {/block:ifHeader}
  503. {block:ifnotHeader}
  504. margin-left:-10px;
  505. {/block:ifnotHeader}
  506.  
  507.  
  508. }
  509. .nav-link a{
  510. border-radius:100px;
  511. display:inline-block;
  512. padding:4px;
  513. background:{color:background};
  514. {block:ifnotThickBorders}
  515. border:1px solid {color:borders};
  516. {/block:ifnotThickBorders}
  517. {block:ifThickBorders}
  518. border:2px solid {color:borders};
  519. {/block:ifThickBorders}
  520. }
  521. .nav-link a:hover{
  522. background:{color:background};
  523. opacity:.7;
  524. {block:ifnotThickBorders}
  525. border:1px solid {color:hover};
  526. {/block:ifnotThickBorders}
  527. {block:ifThickBorders}
  528. border:2px solid {color:hover};
  529. {/block:ifThickBorders}
  530.  
  531. }
  532.  
  533.  
  534. /*pagination*/
  535. #pagination {
  536. margin-bottom:50px;
  537. width:470px;
  538. margin-left:-20px;
  539. word-spacing:-3px;
  540.  
  541. }
  542.  
  543. .prev{
  544. margin-left:-30px;
  545. }
  546. .next{
  547. margin-left:30px;
  548. }
  549.  
  550. #pagination a {
  551. margin-top:-130px;
  552. }
  553.  
  554. /*container*/
  555. #con {
  556. left:50%;
  557. margin-left:-193px;
  558. position:absolute;
  559. }
  560.  
  561.  
  562.  
  563. /*posts*/
  564.  
  565. #entries{
  566. width:400px;
  567. {block:ifHeader}
  568. {block:ifnot400px}
  569. margin-top:-200px;
  570. {/block:ifnot400px}
  571. {block:if400px}
  572. margin-top:-160px;
  573. {/block:if400px}
  574. {/block:ifHeader}
  575.  
  576. {block:ifnotHeader}
  577. {block:ifnot400px}
  578. margin-top:40px;
  579. {/block:ifnot400px}
  580. {block:if400px}
  581. margin-top:90px;
  582. {/block:if400px}
  583. {/block:ifnotHeader}
  584.  
  585. }
  586.  
  587. .posts {
  588. {block:ifnot400px}
  589. width:250px;
  590. margin-left:50px;
  591. {/block:ifnot400px}
  592. {block:if400px}
  593. width:400px;
  594. margin-left:-25px;{/block:if400px}
  595. {block:ifnotThickBorders}
  596. border:1px solid {color:borders};
  597. {/block:ifnotThickBorders}
  598. {block:ifThickBorders}
  599. border:2px solid {color:borders};
  600. {/block:ifThickBorders}
  601. padding:20px 20px 17px;
  602. background:{color:background};
  603. {block:IndexPage}
  604. margin-bottom:100px;
  605. {/block:IndexPage}
  606. {block:PermalinkPage}
  607. margin-bottom:75px;
  608. {/block:PermalinkPage}
  609. {block:ifPostShadow}
  610. -webkit-box-shadow: 5px 3px 10px 0px rgba(57, 50, 50, 0.2);
  611. -moz-box-shadow: 5px 3px 10px 0px rgba(57, 50, 50, 0.2);
  612. box-shadow: 5px 3px 10px 0px rgba(57, 50, 50, 0.2);
  613. {/block:ifPostShadow}
  614. -webkit-transition: all 1s ease;
  615. -moz-transition: all 1s ease;
  616. -o-transition: all 1s ease;
  617. -ms-transition: all 1s ease;
  618. transition: all 1s ease;
  619. -webkit-transition: all 1s ease;
  620. -moz-transition: all 1s ease;
  621. -o-transition: all 1s ease;
  622. -ms-transition: all 1s ease;
  623. transition: all 1s ease;
  624.  
  625. }
  626.  
  627. {block:ifPostShadow}
  628. .posts:hover{
  629. -webkit-box-shadow: 0px 0px 0px 0px rgba(57, 50, 50, 0);
  630. -moz-box-shadow: 0px 0px 0px 0px rgba(57, 50, 50, 0);
  631. box-shadow: 0px 0px 0px 0px rgba(57, 50, 50, 0);
  632. -webkit-transition: all 1s ease;
  633. -moz-transition: all 1s ease;
  634. -o-transition: all 1s ease;
  635. -ms-transition: all 1s ease;
  636. transition: all 1s ease;
  637. }{/block:ifPostShadow}
  638.  
  639. .posts img, .posts li, .posts blockquote {max-width: 100%;}
  640. .caption {width:100%;
  641. margin-top:10px;
  642. }
  643.  
  644.  
  645. /*quote*/
  646.  
  647. #titlequote{
  648. font-family: 'Alegreya Sans SC', sans-serif;
  649. text-transform:lowercase;
  650. letter-spacing:1px;
  651. text-align:justify;
  652. font-size:13px;
  653. line-height:19px;
  654. font-weight:none;
  655. padding:10px;
  656. }
  657.  
  658. #titlequote a{
  659. color:{color:text};
  660. }
  661. #source a{
  662. color:{color:text};
  663. }
  664.  
  665. #source {
  666. text-align:right;
  667. font-style:none;
  668. font-weight:none;
  669. text-transform:uppercase;
  670. letter-spacing:1px;
  671. margin-top:5px;
  672. margin-bottom:20px;
  673. }
  674.  
  675. /*audio*/
  676.  
  677. .player iframe {
  678. width: 32px;
  679. height: 32px;}
  680.  
  681. .tracks{
  682. border:1px solid {color:borders};
  683. {block:if400px}
  684. width: 250px;
  685. padding:9px;
  686. {/block:if400px}
  687. {block:ifnot400px}
  688. width: 110px;
  689. padding:7px;
  690. {/block:ifnot400px}
  691. }
  692.  
  693. .playerbuttonbg {
  694. position: absolute;
  695. left: 36px;
  696. top: 36px;
  697. width: 32px;
  698. height: 32px;
  699. background-color: #ffffff;
  700. padding: 10px;
  701. -webkit-border-radius: 40px;
  702. -moz-border-radius: 40px;
  703. border-radius: 40px;
  704. opacity: .4;
  705. filter: alpha(opacity=40);
  706. -moz-opacity: 0.4;
  707. -khtml-opacity: 0.4;
  708. transition: opacity .7s ease-in-out;
  709. -moz-transition: opacity .7s ease-in-out;
  710. -webkit-transition: opacity .7s ease-in-out;
  711. }
  712.  
  713. .playerbuttonbg:hover {
  714. opacity: 1;
  715. filter: alpha(opacity=100);
  716. -moz-opacity: 1;
  717. -khtml-opacity: 1;
  718. }
  719.  
  720. .newplayerbutton {
  721. position: relative;
  722. width: 26px;
  723. height: 26px;
  724. overflow: hidden;
  725. margin-top:-10px;
  726. }
  727.  
  728. .playerbuttonhug {
  729. position: absolute;
  730. top: -18px;
  731. left: -7px;
  732. }
  733.  
  734. #albumart { float:left; margin:0px 7px;}
  735.  
  736. .tumblr_audio_player {
  737. height:33px;
  738. width:35px;
  739. -moz-transform: scale(0.60, 0.60);
  740. -webkit-transform: scale(0.60, 0.60);
  741. -o-transform: scale(0.60, 0.60);
  742. -ms-transform: scale(0.60, 0.60);
  743. transform: scale(0.60, 0.60);
  744. -moz-transform-origin: top left;
  745. -webkit-transform-origin: top left;
  746. -o-transform-origin: top left;
  747. -ms-transform-origin: top left;
  748. transform-origin: top left;
  749. }
  750.  
  751. .audioimgwrapper {
  752. position: absolute;
  753. left: 0px;
  754. top: 0px;
  755. {block:if400px}
  756. margin-top:15px;
  757. {/block:if400px}
  758. {block:ifnot400px}
  759. margin-top:10px;
  760. {/block:ifnot400px}
  761. margin-left:7px;
  762. -webkit-border-radius: 1px;
  763. -moz-border-radius: 1px;
  764. border-radius: 1px;
  765. overflow: hidden;
  766. width: 109px;
  767. height: 109px;
  768. }
  769.  
  770. .audioimgwrapper img {
  771. width: 100%;
  772. height: auto;
  773. -webkit-border-radius: 1px;
  774. -moz-border-radius: 1px;
  775. border-radius: 1px;
  776. }
  777.  
  778. .trackdetails {
  779. width: auto;
  780. display:inline-block;
  781. margin-left: 128px;
  782. min-height: 85px;
  783. }
  784.  
  785. .audiowrapper {
  786. position: relative;
  787. display:inline-block;
  788. margin-bottom:10px;
  789. }
  790.  
  791. /*asks*/
  792. .q {
  793. margin-bottom:10px;
  794. text-transform:uppercase;
  795. letter-spacing:1px;
  796. color:{color:text};
  797. padding:10px;
  798. line-height:13px;
  799. }
  800.  
  801. .q a{
  802. color:{color:text};
  803. }
  804.  
  805. .as {
  806. font-weight:bold;
  807. background:{color:background};
  808. padding:10px;
  809. color:{color:text};
  810. border:1px solid {color:borders};
  811. }
  812.  
  813.  
  814. .as a{
  815. color:{color:accent};}
  816.  
  817.  
  818. .a {
  819. margin-top:10px;
  820. padding:10px;
  821. letter-spacing:1px;
  822. text-transform:uppercase;
  823. background:{color:background};
  824. color:{color:text};
  825. letter-spacing:1px;}
  826.  
  827.  
  828. /*chat*/
  829.  
  830. .chat ol {
  831. padding:0;
  832. list-style:none;
  833. }
  834. .line {padding:5px 0;}
  835.  
  836. .label {font-weight:bold;
  837. }
  838.  
  839.  
  840. /*permalink and notes*/
  841. .infos {
  842. padding:5px 0;
  843. font-size:8px;
  844. letter-spacing:1px;
  845. text-transform:uppercase;
  846. text-align:center;
  847. margin-top:10px;
  848. background:{color:background};
  849. }
  850.  
  851. .infos a {margin:0 5px;
  852. text-decoration:none;
  853. color:{color:link};
  854. }
  855. .infos a:hover {color:{color:hover};}
  856. .up {cursor:pointer;}
  857.  
  858. .posts:hover .tags{
  859. padding-top:10px;
  860. margin-top:0px;
  861. opacity:1;
  862. -webkit-transition: all 0.8s ease;
  863. -moz-transition: all 0.8s ease;
  864. transition: all 0.8s ease;
  865. }
  866.  
  867. .tags {
  868. opacity:0;
  869. margin-top:-14px;
  870. word-break:break-all;
  871. -webkit-transition: all 0.8s ease;
  872. -moz-transition: all 0.8s ease;
  873. transition: all 0.8s ease;
  874. }
  875.  
  876. .tags a{
  877. text-decoration:none;}
  878.  
  879.  
  880.  
  881. .pagenotes {
  882. {block:if400px}
  883. width:350px;
  884. margin-left:-2px;
  885. {/block:if400px}
  886. {block:ifnot400px}
  887. width:245px;
  888. margin-left:48px;
  889. {/block:ifnot400px}
  890. margin-top:25px;
  891. padding:25px;
  892. position:relative;
  893. background:{color:background};
  894. margin-bottom:50px;
  895. font-size:8px;
  896. }
  897. .pagenotes img {
  898. display:none!important;}
  899. .pagenotes ol {
  900. margin:0;
  901. padding:0;
  902. display:block;
  903. }
  904. .pagenotes li {
  905. line-height:200%;
  906. list-style-type:none;
  907. text-align:left;
  908. font-size:8px;
  909. letter-spacing:1px;
  910. font-family:arial;
  911. text-transform:uppercase;
  912. }
  913.  
  914.  
  915. /* POP UPS AND SLIDES */
  916.  
  917.  
  918. .cbp-spmenu {
  919. position: fixed;
  920. }
  921.  
  922.  
  923. /* Orientation-dependent styles for the content of the menu */
  924.  
  925. .cbp-spmenu-horizontal {
  926. padding:10px;
  927. margin-left:1050px;
  928. text-align:justify;
  929. font-size:10px;
  930. color:{color:background};
  931. {block:ifThickBorders}
  932. border-left:5px solid {color:borders};
  933. {/block:ifThickBorders}
  934. {block:ifnotThickBorders}
  935. border-left:3px solid {color:borders};
  936. {/block:ifnotThickBorders}
  937. width: 400px;
  938. height: 100%;
  939. z-index:1;}
  940.  
  941.  
  942.  
  943. /* Horizontal menu that slides from the top or bottom */
  944.  
  945. .cbp-spmenu-bottom {
  946. right: -700px;
  947. bottom:0;
  948. }
  949.  
  950. .cbp-spmenu-bottom.cbp-spmenu-open {
  951. bottom:0px;
  952. right:0px;
  953. }
  954.  
  955.  
  956.  
  957.  
  958. /* Transitions */
  959.  
  960. .cbp-spmenu,
  961. .cbp-spmenu-push {
  962. -webkit-transition: all 0.8s ease;
  963. -moz-transition: all 0.8s ease;
  964. transition: all 0.8s ease;
  965. }
  966.  
  967.  
  968.  
  969. .pushtitle {
  970. text-align:center;
  971. color:{color:text};
  972. font-size:12px;
  973. margin-bottom:5px;
  974. letter-spacing:1px;
  975. text-transform:uppercase;
  976. }
  977.  
  978.  
  979. #pushdescription {
  980. margin-top:50px;
  981. line-height:14px;
  982. padding:20px;
  983. overflow-y:scroll;
  984. overflow-x:hidden;
  985.  
  986. }
  987.  
  988.  
  989. .cbp-spmenu {
  990. position: fixed;
  991. }
  992.  
  993.  
  994.  
  995. .ask-title{
  996. font-family: 'Alegreya Sans SC', sans-serif;
  997. padding:7px;
  998. text-align:center;
  999. line-height:1.5em;
  1000. font-size:18px;
  1001. font-weight:800;
  1002. color:{color:title};
  1003. padding:8px;
  1004. {block:ifThickBorders}
  1005. border:3px solid {color:borders};
  1006. {/block:ifThickBorders}
  1007. {block:ifnotThickBorders}
  1008. border:1px solid {color:borders};
  1009. {/block:ifnotThickBorders}
  1010. background:{color:background};
  1011. }
  1012. .ask-faq{
  1013. color:{color:text};
  1014. background:{color:background};
  1015. padding:4px;
  1016. {block:ifThickBorders}
  1017. border:2px solid {color:borders};
  1018. {/block:ifThickBorders}
  1019. {block:ifnotThickBorders}
  1020. border:1px solid {color:borders};
  1021. {/block:ifnotThickBorders}
  1022. background:{color:background};
  1023. }
  1024.  
  1025.  
  1026. /*DO NOT TOUCH*/
  1027. #creds {
  1028. font-family: 'Alegreya Sans SC', sans-serif;
  1029. letter-spacing:1px;
  1030. text-transform:uppercase;
  1031. bottom:10px;
  1032. position:fixed;
  1033. right:6px;
  1034. float:right;
  1035. padding:5px;
  1036. z-index:1;
  1037. -webkit-transition: all 1s ease;
  1038. -moz-transition: all 1s ease;
  1039. -o-transition: all 1s ease;
  1040. -ms-transition: all 1s ease;
  1041. transition: all 1s ease;
  1042. }
  1043. #creds a{
  1044. color:{color:text};
  1045. {block:ifnotThickBorders}
  1046. border:1px solid {color:borders};
  1047. {/block:ifnotThickBorders}
  1048. {block:ifThickBorders}
  1049. border:2px solid {color:borders};
  1050. {/block:ifThickBorders}
  1051. padding:5px;
  1052. background:white;
  1053. -webkit-transition: all 1s ease-in;
  1054. -moz-transition: all 1s ease-in;
  1055. -o-transition: all 1s ease-in;
  1056. -ms-transition: all 1s ease-in;
  1057. transition: all 1s ease-in;
  1058. }
  1059.  
  1060.  
  1061. #creds a:hover {
  1062. text-decoration:none;
  1063. color:white;
  1064. background:{color:borders};
  1065. {block:ifnotThickBorders}
  1066. border:1px solid transparent;
  1067. {/block:ifnotThickBorders}
  1068. {block:ifThickBorders}
  1069. border:2px solid transparent;
  1070. {/block:ifThickBorders}
  1071. -webkit-transition: all 1s ease-out;
  1072. -moz-transition: all 1s ease-out;
  1073. -o-transition: all 1s ease-out;
  1074. -ms-transition: all 1s ease-out;
  1075. transition: all 1s ease-out;
  1076. }
  1077.  
  1078.  
  1079. #tumblrcontrols{
  1080. position:fixed;
  1081. top:10px;
  1082. right:10px;
  1083. word-spacing:10px;
  1084. }
  1085. #tumblrcontrols{
  1086. font-size:8px;
  1087. letter-spacing:1px;
  1088. text-transform:uppercase;
  1089. color:{color:text};
  1090. -webkit-transition: all 1.6s ease-in;
  1091. -moz-transition: all 1.6s ease-in;
  1092. -o-transition: all 1.6s ease-in;
  1093. -ms-transition: all 1.6s ease-in;
  1094. transition: all 1.6s ease-in;
  1095. }
  1096.  
  1097. #tumblrcontrols a{
  1098. text-decoration:none;
  1099. color:{color:text};
  1100. {block:ifnotThickBorders}
  1101. border:1px solid {color:borders};
  1102. {/block:ifnotThickBorders}
  1103. {block:ifThickBorders}
  1104. border:2px solid {color:borders};
  1105. {/block:ifThickBorders}
  1106. background:white;
  1107. padding:5px;
  1108. }
  1109.  
  1110. #tumblrcontrols a:hover{
  1111. text-decoration:none;
  1112. color:white;
  1113. {block:ifnotThickBorders}
  1114. border:1px solid transparent;
  1115. {/block:ifnotThickBorders}
  1116. {block:ifThickBorders}
  1117. border:2px solid transparent;
  1118. {/block:ifThickBorders}
  1119. background:{color:accent};
  1120. }
  1121.  
  1122. {block:IndexPage}
  1123. #tumblr_controls {display:none;}
  1124. {/block:IndexPage}
  1125.  
  1126. {block:PermalinkPage}
  1127. #tumblrcontrols{
  1128. display:none;}
  1129. iframe#tumblr_controls {
  1130. top:10px;
  1131. position: fixed !important;
  1132. right:20px !important;
  1133. -moz-transition: all 1s ease-out;
  1134. -webkit-transition: opacity 0.7s linear;
  1135. -webkit-transition: all 1s ease-out;
  1136. transition: all 1s ease-out;
  1137. opacity: 0.4;}
  1138.  
  1139. iframe#tumblr_controls:hover {
  1140. -webkit-transition: opacity 0.7s linear;
  1141. -moz-transition: all 0.4s ease-out;
  1142. -webkit-transition: all 0.4s ease-out;
  1143. transition: all 0.4s ease-out;
  1144. opacity:.7;}
  1145. {/block:PermalinkPage}
  1146.  
  1147. {CustomCSS}
  1148.  
  1149.  
  1150. </style>
  1151.  
  1152. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
  1153. <script type="text/javascript">
  1154. $(function(){
  1155. var stickyRibbonTop = $('#line').offset().top;
  1156.  
  1157. $(window).scroll(function(){
  1158. if( $(window).scrollTop() > stickyRibbonTop ) {
  1159. $('.content').addClass('cool');
  1160. } else {
  1161. $('.content').removeClass('cool');
  1162. }
  1163. });
  1164. });
  1165. </script>
  1166. <script type="text/javascript">
  1167. $(function(){
  1168. var stickyRibbonTop = $('#line').offset().top;
  1169.  
  1170. $(window).scroll(function(){
  1171. if( $(window).scrollTop() > stickyRibbonTop ) {
  1172. $('.stars').addClass('cool2');
  1173. } else {
  1174. $('.stars').removeClass('cool2');
  1175. }
  1176. });
  1177. });
  1178. </script>
  1179.  
  1180. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  1181. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  1182. <script type="text/javascript" charset="utf-8">
  1183. var $j = jQuery.noConflict();
  1184. $j(function() {
  1185. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  1186. $j("img").lazyload({
  1187. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  1188. effect: "fadeIn",
  1189. });
  1190. });
  1191. </script>
  1192.  
  1193. </head>
  1194.  
  1195. <body>
  1196. <body class="{select:Background image}">
  1197. <div id="tumblrcontrols">
  1198. <a href="http://www.tumblr.com/follow/{text:Tumblr Url}">follow</a>
  1199. <a href="http://www.tumblr.com/dashboard">dashboard</a>
  1200. </div>
  1201. <body class="cbp-spmenu-push" class="{select:Background image}">
  1202.  
  1203. <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom" id="cbp-spmenu-s1">
  1204. <div class="menu" >
  1205. <div class="pushtitle">
  1206. </div>
  1207. <div id="pushdescription"><div style="padding:5px;">
  1208. <big class="ask-title">FAQ & ASK</big>
  1209. <p class="ask-faq">
  1210. {text:FAQ}</p>
  1211. </div>
  1212. <iframe frameborder="0" height="250" id="ask_form" scrolling="none" src="http://www.tumblr.com/ask_form/{text:Tumblr Url}.tumblr.com" width="100%"> </iframe>
  1213. <p></p>
  1214. </center>
  1215. </div>
  1216. </div>
  1217. </div>
  1218. </nav>
  1219. <body class="cbp-spmenu-push">
  1220.  
  1221.  
  1222. {block:ifHeader}
  1223. <div class="stars"></div>
  1224. <header>
  1225. <div><h1><a href="/">{Title}</a></h1></div>
  1226. <nav class="uno">
  1227. <a title="message" class="toggle menu-bottom"></a>
  1228. <a href="{text:Link 1 URL}" title="{text:Link 1}"></a>
  1229. <a href="{text:Link 2 URL}" title="{text:Link 2}"></a>
  1230. <a href="{text:Link 3 URL}" title="{text:Link 3}"></a>
  1231. {block:ifShowLink4}<a href="{text:Link 4 URL}" title="{text:Link 4}"></a>{/block:ifShowLink4}
  1232. {block:ifShowLink5}<a href="{text:Link 5 URL}" title="{text:Link 5}"></a>{/block:ifShowLink5}
  1233. </nav>
  1234. </header>
  1235.  
  1236. <div class="content">
  1237. <div class="sidebar">
  1238. <div class="btitle"><a href="/">{Title}</a></div>
  1239. <div class="nav-link">
  1240. <a title="message" class="toggle menu-bottom"></a>
  1241. <a href="{text:Link 1 URL}" title="{text:Link 1}"></a>
  1242. <a href="{text:Link 2 URL}" title="{text:Link 2}"></a>
  1243. <a href="{text:Link 3 URL}" title="{text:Link 3}"></a>
  1244. {block:ifShowLink4}<a href="{text:Link 4 URL}" title="{text:Link 4}"></a>{/block:ifShowLink4}
  1245. {block:ifShowLink5}<a href="{text:Link 5 URL}" title="{text:Link 5}"></a>{/block:ifShowLink5}
  1246. </div>
  1247. <div class="descript">
  1248. {Description}
  1249. </div>
  1250. </div>
  1251. </div>
  1252. {/block:ifHeader}
  1253.  
  1254. {block:ifnotHeader}
  1255.  
  1256. <div class="sidebar">
  1257. <div class="btitle"><a href="/">{Title}</a></div>
  1258. <div class="nav-link">
  1259. <a title="message" class="toggle menu-bottom"></a>
  1260. <a href="{text:Link 1 URL}" title="{text:Link 1}"></a>
  1261. <a href="{text:Link 2 URL}" title="{text:Link 2}"></a>
  1262. <a href="{text:Link 3 URL}" title="{text:Link 3}"></a>
  1263. {block:ifShowLink4}<a href="{text:Link 4 URL}" title="{text:Link 4}"></a>{/block:ifShowLink4}
  1264. {block:ifShowLink5}<a href="{text:Link 5 URL}" title="{text:Link 5}"></a>{/block:ifShowLink5}
  1265. </div>
  1266. <div class="descript">
  1267. {Description}
  1268. </div>
  1269. </div>
  1270. {/block:ifnotHeader}
  1271.  
  1272. <div id="con">
  1273. <div id="line"></div>
  1274. <div id="entries" class="{select:Post Size}" >
  1275.  
  1276. {block:Posts}
  1277. <div class="posts" class="{select:Post Size}">
  1278.  
  1279. {block:Quote}
  1280. <div id="titlequote">{Quote}</div>
  1281. {block:Source}<div id="source">{Source}</div>{/block:Source}
  1282. {/block:Quote}
  1283.  
  1284.  
  1285.  
  1286. {block:Text}
  1287. {block:Title}
  1288. <div id="title">{Title}</div>{/block:Title}
  1289. {Body}
  1290.  
  1291. {/block:Text}
  1292.  
  1293. {block:Link}
  1294. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  1295. {/block:Link}
  1296.  
  1297. {block:Chat}
  1298. {block:Title}
  1299. <h1>{Title}</h1>
  1300. {/block:Title}
  1301. <div class="chat">
  1302. <ol>{block:Lines}
  1303. <li class="line {Alt}">
  1304. {block:Label}
  1305. <span class="label">
  1306. {Label}</span>
  1307. {/block:Label}{Line}</li>
  1308. {/block:Lines}
  1309. </ol></div>
  1310. {/block:Chat}
  1311.  
  1312.  
  1313. {block:Photo}
  1314.  
  1315. {LinkOpenTag}
  1316. {block:ifnot400px}<img src="{PhotoURL-250}">{/block:ifnot400px}
  1317. {block:if400px}<img src="{PhotoURL-400}">{/block:if400px}
  1318. {LinkCloseTag}
  1319.  
  1320. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1321. {/block:Photo}
  1322.  
  1323. {block:Photoset}
  1324. {block:if400px}{Photoset-400}{/block:if400px}
  1325. {block:ifnot400px}{Photoset-250}{/block:ifnot400px}
  1326. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1327. {/block:Photoset}
  1328.  
  1329. {block:Video}
  1330. {block:if400px}{Video-400}{/block:if400px}
  1331. {block:ifnot400px}{Video-250}{/block:ifnot400px}
  1332. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1333. {/block:Video}
  1334.  
  1335. {block:AudioPlayer}
  1336.  
  1337. <div class="audiowrapper">
  1338. {block:AlbumArt}
  1339. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  1340. {/block:AlbumArt}
  1341.  
  1342. <div class="playerbuttonbg">
  1343. {AudioPlayerWhite}
  1344. </div>
  1345.  
  1346. <div class="trackdetails">
  1347.  
  1348. {block:TrackName}<p class="tracks">{TrackName}</p>{/block:TrackName}
  1349. {block:Artist}<p class="tracks">{Artist}</p>{/block:Artist}
  1350. {block:Album}<p class="tracks">{Album}</p>{/block:Album}
  1351. </div>
  1352. </div>
  1353. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1354. {/block:AudioPlayer}
  1355.  
  1356. {block:Answer}
  1357. <div class="q">
  1358. <div class="as" >{Asker} said: {Question}</div>
  1359. <div class="a">{Answer}</div>
  1360. </div>
  1361. {/block:Answer}
  1362.  
  1363. {block:Date}
  1364. <div class="infos">
  1365. <a href="{Permalink}">{Timeago}</a>{block:NoteCount}<a href="{Permalink}">{NoteCountwithlabel}</a>{/block:NoteCount}<a href="{ReblogURL}" target="_blank">reblog</a>{block:permalinkpage}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{block:ContentSource}<a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:ContentSource}{/block:RebloggedFrom}{/block:permalinkpage}{block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">-{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1366. </div>
  1367. {/block:Date}
  1368.  
  1369.  
  1370. </div>
  1371.  
  1372.  
  1373. {block:PostNotes}
  1374. <div class="pagenotes">
  1375. {PostNotes}
  1376. </div>
  1377. {/block:PostNotes}
  1378.  
  1379.  
  1380. {/block:Posts}
  1381.  
  1382. <div id="pagination">
  1383. {block:Pagination}
  1384. {block:PreviousPage}
  1385. <a href="{PreviousPage}" class="prev"title="previous" style="float:left"><img width="20px" src="http://static.tumblr.com/3dkvxpf/dzpnb7ne1/arrow395.png"></a>
  1386. {/block:PreviousPage}
  1387.  
  1388.  
  1389. {block:NextPage}
  1390. <a href="{NextPage}" class="next" title="forward" style="float:right"><img width="20px" src="http://static.tumblr.com/3dkvxpf/a82nb7ngv/move13.png"></a>
  1391. {/block:NextPage}
  1392. {/block:Pagination}
  1393. </div>
  1394.  
  1395.  
  1396.  
  1397. </div>
  1398.  
  1399. </div>
  1400.  
  1401.  
  1402. {block:ContentSource}
  1403. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1404. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1405. {/block:SourceLogo}
  1406. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1407. {/block:ContentSource}
  1408.  
  1409. <div id="creds"><a title="960px" href="http://960px.tumblr.com/">TT</a></div>
  1410.  
  1411.  
  1412.  
  1413. </div>
  1414. </body>
  1415. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!