API tools faq
paste
Advertisement
trenzalours

theme 15 - electric

trenzalours
Aug 20th, 2014
1,148
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.11 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. <head>
  4. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  5. <link href='http://fonts.googleapis.com/css?family=Lato:300italic' rel='stylesheet' type='text/css'>
  6. <title>{Title}</title>
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}
  10. <meta name="description" content="{MetaDescription}" />
  11. {/block:Description}
  12.  
  13. <!---||||||||||~* ᴛʀᴇɴᴢᴀᴛʜᴇᴍᴇs ﹣ ᴛʀᴇɴᴢᴀʟᴏᴜʀs *~||||||||||
  14.  
  15. ᴀᴘᴏʟʟᴏ ᴛʜᴇᴍᴇ ﹣
  16. Don't forget to scroll down and fill in your updates tab! You can make it into just about anything though it doesnt need to be your updates. It can be an about me page, updates, or even a theme rules page.--->
  17.  
  18. <meta name="color:background" content="#ffffff"/>
  19. <meta name="color:Blog Title" content="#ffffff"/>
  20. <meta name="color:Main Links" content="#ffffff"/>
  21. <meta name="color:Border" content="#000000"/>
  22. <meta name="color:Text" content="#838282"/>
  23. <meta name="color:Titles" content="#666666"/>
  24. <meta name="color:Link" content="#b8b8b8"/>
  25. <meta name="color:Hover" content="#ffffff"/>
  26. <meta name="color:Accent" content="#eeeeee"/>
  27. <meta name="color:Gradient1" content="#f1f1f1"/>
  28. <meta name="color:Gradient2" content="#eeeeee"/>
  29. <meta name="color:Scrollbar" content="#b8b8b8"/>
  30.  
  31. <meta name="image:Background Image" content="http://static.tumblr.com/3dkvxpf/yFjn941og/tumblr_mx3toqf8vu1st5lhmo1_1280.jpg"/>
  32. <meta name="text:FAQ Here" content="type out your facts and questions">
  33. <meta name="text:url" content="put your url here">
  34. <meta name="if:Tumblr Controls" content="1">
  35. <meta name="if:Double Links" content="1">
  36. <meta name="text:link 1" content="link 1">
  37. <meta name="text:link1 url" content="/">
  38. <meta name="text:link 2" content="link 2">
  39. <meta name="text:link2 url" content="/">
  40. <meta name="text:link 3" content="link 3">
  41. <meta name="text:link3 url" content="/">
  42. <meta name="text:link 4" content="link 4">
  43. <meta name="text:link4 url" content="/">
  44. <meta name="text:link 5" content="link 5">
  45. <meta name="text:link5 url" content="/">
  46. <meta name="text:link 6" content="link 6">
  47. <meta name="text:link6 url" content="/">
  48. <meta name="text:link 7" content="link 7">
  49. <meta name="text:link7 url" content="/">
  50. <meta name="text:link 8" content="link 8">
  51. <meta name="text:link8 url" content="/">
  52.  
  53. {block:ifDoubleLinks}
  54. <meta name="text:link 9" content="link 9">
  55. <meta name="text:link9 url" content="/">
  56. <meta name="text:link 10" content="link 10">
  57. <meta name="text:link10 url" content="/">
  58. <meta name="text:link 11" content="link 11">
  59. <meta name="text:link11 url" content="/">
  60. <meta name="text:link 12" content="link 12">
  61. <meta name="text:link12 url" content="/">
  62. <meta name="text:link 13" content="link 13">
  63. <meta name="text:link13 url" content="/">
  64. <meta name="text:link 14" content="link 14">
  65. <meta name="text:link14 url" content="/">
  66. <meta name="text:link 15" content="link 15">
  67. <meta name="text:link15 url" content="/">
  68. <meta name="text:link 16" content="link 16">
  69. <meta name="text:link16 url" content="/">
  70. {/block:ifDoubleLinks}
  71.  
  72.  
  73. <!--- jquery click toggle by irma--->
  74. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  75.  
  76. <script>
  77. $(document).ready(function(){
  78. $(".button").click(function(){
  79. $(".slide-link").removeClass("periwink");
  80. });
  81. });
  82. </script>
  83.  
  84. <script>
  85. $(document).ready(function(){
  86. $(".button3").click(function(){
  87. $(".slide-link").removeClass("periwink");
  88. });
  89. });
  90. </script>
  91.  
  92. <script>
  93. $(document).ready(function(){
  94. $(".button2").click(function(){
  95. $(".slide-ask").removeClass("periwink");
  96. });
  97. });
  98. </script>
  99.  
  100. <script>
  101. $(document).ready(function(){
  102. $(".button3").click(function(){
  103. $(".slide-ask").removeClass("periwink");
  104. });
  105. });
  106. </script>
  107.  
  108. <script>
  109. $(document).ready(function(){
  110. $(".button").click(function(){
  111. $(".slide-rules").removeClass("periwink");
  112. });
  113. });
  114. </script>
  115.  
  116. <script>
  117. $(document).ready(function(){
  118. $(".button2").click(function(){
  119. $(".slide-rules").removeClass("periwink");
  120. });
  121. });
  122. </script>
  123.  
  124.  
  125. <script>
  126. $(document).ready(function(){
  127. $(".button").click(function(){
  128. $(".slide-ask").toggleClass("periwink");
  129. });
  130. });
  131. </script>
  132.  
  133. <script>
  134. $(document).ready(function(){
  135. $(".button2").click(function(){
  136. $(".slide-link").toggleClass("periwink");
  137. });
  138. });
  139. </script>
  140.  
  141. <script>
  142. $(document).ready(function(){
  143. $(".button3").click(function(){
  144. $(".slide-rules").toggleClass("periwink");
  145. });
  146. });
  147. </script>
  148.  
  149.  
  150. <!-- *TOOLTIPS* -->
  151.  
  152. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  153.  
  154. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  155.  
  156. <script>
  157.  
  158. (function($){
  159.  
  160. $(document).ready(function(){
  161.  
  162. $("a[title]").style_my_tooltips({
  163.  
  164. tip_follows_cursor:true,
  165.  
  166. tip_delay_time:30,
  167.  
  168. tip_fade_speed:300,
  169.  
  170. attribute:"title"
  171.  
  172. });
  173.  
  174. });
  175.  
  176. })(jQuery);
  177.  
  178. </script>
  179.  
  180. <style type="text/css">
  181.  
  182. /* TOOPTIP CSS */
  183. #s-m-t-tooltip{
  184. padding:4px;
  185. padding-left:6px;
  186. padding-right:6px;
  187. position:absolute;
  188. margin: 10px 20px;
  189. z-index: 99999999999;
  190. text-transform:uppercase;
  191. text-decoration:none;
  192. letter-spacing:1px;
  193. font-family:consolas;
  194. font-size:8px;
  195. background:{color:background};
  196. color:{color:text};}
  197.  
  198. *, #link a:hover {
  199. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  200. }
  201.  
  202. *, #tops a:hover {
  203. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  204. }
  205.  
  206. *, body a:hover {
  207. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  208. }
  209.  
  210.  
  211. body {
  212. max-width: 100%;
  213. overflow-x: hidden;
  214. background: url('http://static.tumblr.com/3dkvxpf/L5Cnami1v/subtle_dots.png')
  215. repeat center center fixed;
  216. font-family:calibri;
  217. font-size:12px;
  218. color:{color:text};
  219. line-height:1.5em;
  220. letter-spacing:1px;
  221. margin:0px;
  222. padding:0px;}
  223.  
  224. /* SELECTION */
  225.  
  226. ::selection {
  227. background-color:{color:accent};
  228. color:white;}
  229.  
  230. /* SCROLLBAR */
  231.  
  232. ::-webkit-scrollbar {
  233. background:-webkit-linear-gradient(top, {color:gradient1} 0%,
  234. {color:gradient2} 75%);
  235. height:4px;
  236. width:4px;}
  237.  
  238. ::-webkit-scrollbar-thumb:vertical {
  239. background:{color:scrollbar};
  240. border:1px solid {color:gradient1};
  241. border-right:2px solid {color:gradient1};
  242. opacity:1;
  243. height:4px;}
  244.  
  245. ::-webkit-scrollbar-thumb:horizontal {
  246. background-color:transparent;
  247. height:4px!important;}
  248.  
  249.  
  250. a {
  251. color:{color:link};
  252. text-decoration:none;
  253. }
  254.  
  255. a:hover {
  256. color:{color:hover};
  257. letter-spacing:1px;
  258. text-decoration:none;
  259. -webkit-transition: all 1s ease-out;
  260. -moz-transition: all 1s ease-out;
  261. -o-transition: all 1s ease-out;
  262. -ms-transition: all 1s ease-out;
  263. transition: all 1s ease-out;
  264. }
  265.  
  266. blockquote {
  267. padding:5px 0 5px 5px;
  268. border-left:1px solid {color:gradient2};
  269. margin-left:30px;
  270. }
  271.  
  272. blockquote a{
  273. color:{color:link};
  274. }
  275.  
  276. b,strong{
  277. color:{color:accent};
  278. font-weight:bold;
  279. }
  280. em,i{
  281. color:{color:accent};
  282. font-style:italic;
  283. }
  284.  
  285.  
  286. strike{
  287. text-decoration: line-through;
  288. }
  289.  
  290. small {
  291. font-size:9px;}
  292.  
  293. big {
  294. font-size:12px;}
  295.  
  296. h1{
  297. color:{color:titles};
  298. font-size:14px;
  299. font-weight:none;
  300. }
  301.  
  302.  
  303. li{
  304. color:{color:text};
  305. margin-bottom:3px;
  306. list-style-type:none;
  307. background:{color:background};
  308. padding:5px;
  309. font-family:consolas;
  310. font-size:9px;
  311. text-transform:uppercase;}
  312.  
  313. pre{
  314. background:{color:background};
  315. padding:10px;
  316. color:{color:text};
  317. font-family:consolas;
  318. text-transform:uppercase;
  319. font-size:9px;
  320. letter-spacing:1px;
  321. white-space: pre-wrap;
  322. white-space: -moz-pre-wrap;
  323. white-space: -pre-wrap;
  324. white-space: -o-pre-wrap;
  325. word-wrap: break-word;}
  326.  
  327. code{
  328. font-weight:bold;
  329. text-transform:lowercase;
  330. font-style:italic;
  331. }
  332.  
  333.  
  334. #container {
  335. width:auto;
  336. margin:20px 0px 20px 100px;
  337. }
  338.  
  339. #full{
  340. width:800px;
  341. height:800px;
  342. overflow:hidden;
  343. border:1px solid black;
  344. }
  345.  
  346. #contains{
  347. left:50%;
  348. padding:10px;
  349. height:450px;
  350. width:500px;
  351. position:fixed;
  352. margin-top:50px;
  353. padding-top:50px;
  354. margin-left:-230px;
  355. overflow-y: scroll;
  356. overflow-x: hidden;
  357. text-align:center;
  358. border:1px solid {color:border};
  359. background:-webkit-linear-gradient(top, {color:gradient1} 0%,
  360. {color:gradient2} 75%);
  361.  
  362. }
  363.  
  364.  
  365.  
  366. #tops{
  367. padding:10px;
  368. height:490px;
  369. width:75px;
  370. margin-top:-50px;
  371. margin-left:-10px;
  372. position:fixed;
  373. padding-top:10px;
  374. overflow:hidden;
  375. position:fixed;
  376. border-right:1px solid {color:border};
  377. background:url({image:Background Image})
  378. no-repeat center left;
  379. -webkit-background-size:cover;
  380. -moz-background-size:cover;
  381. -o-background-size:cover;
  382. background-size:cover;
  383. z-index:9;
  384. }
  385.  
  386. #blogt{
  387. right:50%;
  388. padding:8px;
  389. width:200px;
  390. height:12px;
  391. position:fixed;
  392. margin-top:28px;
  393. margin-right:-292px;
  394. border-radius:5px;
  395. font-size:14px;
  396. line-height:8px;
  397. border:1px solid black;
  398. text-transform:uppercase;
  399. font-style:italic;
  400. text-align:right;
  401. letter-spacing:3px;
  402. color:{color:blog title};
  403. font-family: 'Lato', sans-serif;
  404. background:url({image:Background Image})
  405. no-repeat top left;
  406. -webkit-background-size:cover;
  407. -moz-background-size:cover;
  408. -o-background-size:cover;
  409. background-size:cover;}
  410.  
  411. #blogt a{
  412. text-align:right;
  413. color:{color:blog title};
  414. -webkit-transition: all .5s ease-in;
  415. -moz-transition: all .5s ease-in;
  416. -o-transition: all .5s ease-in;
  417. -ms-transition: all .5s ease-in;
  418. transition: all .5s ease-in;
  419. }
  420. #blogt a:hover{
  421. text-decoration:none;
  422. color:{color:hover};
  423. letter-spacing:4px;
  424. -webkit-transition: all .5s ease-out;
  425. -moz-transition: all .5s ease-out;
  426. -o-transition: all .5s ease-out;
  427. -ms-transition: all .5s ease-out;
  428. transition: all .5s ease-out;
  429. }
  430.  
  431. #link{
  432. width:78px;
  433. height:490px;
  434. display:inline-block;
  435. text-align:left;
  436. font-size:8px;
  437. font-family:consolas;
  438. text-transform:uppercase;
  439. word-spacing:5px;
  440. padding:10px;
  441. background:transparent;
  442. letter-spacing:1px;
  443. color:{color:Main Links};
  444. border-left:1px solid {color:Main Links};
  445. }
  446. #link a{
  447. color:{color:Main Links};
  448. -webkit-transition: all .5s ease-in;
  449. -moz-transition: all .5s ease-in;
  450. -o-transition: all .5s ease-in;
  451. -ms-transition: all .5s ease-in;
  452. transition: all .5s ease-in;
  453. }
  454. #link a:hover{
  455. color:{color:hover};
  456. -webkit-transition: all .5s ease-out;
  457. -moz-transition: all .5s ease-out;
  458. -o-transition: all .5s ease-out;
  459. -ms-transition: all .5s ease-out;
  460. transition: all .5s ease-out;
  461.  
  462. }
  463.  
  464. /*---------------*/
  465. /***** POSTS *****/
  466. /*---------------*/
  467.  
  468. #entries {
  469. padding:0px;
  470. width:400px;
  471. margin-left:95px;
  472. }
  473.  
  474.  
  475. /*/ POSTS /*/
  476.  
  477.  
  478. #stuff {
  479. padding:30px;
  480. margin-top:-10px;
  481. margin-bottom:120px;
  482. margin-left:40px;
  483. width:250px;
  484. text-align:justify;
  485. font-size:11px;
  486. line-height:100%;
  487. letter-spacing:0x;
  488. color:{color:text};
  489. background:white;
  490.  
  491. }
  492.  
  493. #stuff img, #stuff li, #stuff blockquote {
  494. max-width: 100%;}
  495.  
  496.  
  497.  
  498.  
  499. /*quote*/
  500.  
  501. #titlequote{
  502. font-family: 'Lato', sans-serif;
  503. text-transform:uppercase;
  504. font-style:italic;
  505. background:white;
  506. letter-spacing:1px;
  507. text-align:justify;
  508. font-size:13px;
  509. line-height:19px;
  510. font-weight:none;
  511. padding:10px;
  512. color:{color:text};
  513. }
  514.  
  515. #titlequote a{
  516. color:{color:text};
  517. }
  518. #source a{
  519. color:{color:titles};
  520. }
  521.  
  522. #source {
  523. text-align:right;
  524. font-style:none;
  525. font-weight:none;
  526. text-transform:uppercase;
  527. font-family:consolas;
  528. font-size:8px;
  529. letter-spacing:1px;
  530. margin-top:15px;
  531. }
  532.  
  533.  
  534.  
  535. #annoy a{
  536. color:{color:link};
  537. text-transform:uppercase;
  538. font-family:consolas;
  539. text-decoration:none;
  540. letter-spacing:1px;
  541. }
  542.  
  543. #annoy a:hover{
  544. color:{color:hover};
  545. }
  546.  
  547.  
  548. #audios{
  549. border:1px solid {color:gradient2};
  550. background:white;
  551. padding:10px;
  552. color:{color:text};
  553. }
  554.  
  555. .player {
  556. width:25px;
  557. height:25px;
  558. overflow:hidden;
  559. position:absolute;
  560. color:{color:text};
  561. background:white;}
  562.  
  563. .audioinfo {
  564. color:{color:text};
  565. margin-left:50px;
  566. background:white;
  567. }
  568.  
  569.  
  570. /*asks*/
  571. .lady{
  572. color:{color:titles};
  573. text-align:left;
  574. width:240px;
  575. padding:6px;
  576. border-bottom:1px solid {color:borders};
  577. background:{color:gradient1};
  578. line-height:17px;
  579. }
  580. .q {
  581. padding-top:20px;
  582. margin-bottom:10px;
  583. text-transform:uppercase;
  584. font-family:consolas;
  585. font-size:9px;
  586. letter-spacing:1px;
  587. color:{color:text};}
  588.  
  589. .as {
  590. font-weight:bold;
  591. background:white;
  592. padding:10px;}
  593.  
  594. .a {
  595. width:240px;
  596. margin-top:10px;
  597. padding:10px;
  598. letter-spacing:1px;
  599. text-transform:uppercase;
  600. background:{color:gradient1};
  601. color:{color:titles};
  602. border-bottom:1px solid {color:borders};
  603. font-family:consolas;
  604. font-size:9px;}
  605.  
  606.  
  607.  
  608.  
  609.  
  610.  
  611. /*chat*/
  612.  
  613. .chat ol {
  614. padding:0;
  615. list-style:none;
  616. }
  617. .line {padding:5px 0;}
  618.  
  619. .label {font-weight:bold;
  620. }
  621.  
  622.  
  623. /*/ NOTES /*/
  624.  
  625.  
  626. #info {
  627. {block:IndexPage}
  628. opacity:0;
  629. {/block:IndexPage}
  630. {block:PermalinkPage}
  631. opacity:1;
  632. {/block:PermalinkPage}opacity:0;
  633. position:absolute;
  634. background:white;
  635. padding:10px;
  636. width:250px;
  637. text-transform:uppercase;
  638. font-family:consolas;
  639. font-size:9px;
  640. letter-spacing:1px;
  641. line-height:10px;
  642. color:{color:link};
  643. margin-top:0px;
  644. text-align:center;
  645. -webkit-transition: all 1s ease-in;
  646. -moz-transition: all 1s ease-in;
  647. -o-transition: all 1s ease-in;
  648. -ms-transition: all 1s ease-in;
  649. transition: all 1s ease-in;
  650. }
  651.  
  652.  
  653. #info a{
  654. color:{color:link};
  655. -webkit-transition: all 1s ease-in-out;
  656. -moz-transition: all 1s ease-in-out;
  657. -o-transition: all 1s ease-in-out;
  658. -ms-transition: all 1s ease-in-out;
  659. transition: all 1s ease-in-out;
  660. }
  661.  
  662. #info i{
  663. font-size:9px;
  664. padding:2px;
  665. color:{color:link};
  666. -webkit-transition: all 1s ease-in-out;
  667. -moz-transition: all 1s ease-in-out;
  668. -o-transition: all 1s ease-in-out;
  669. -ms-transition: all 1s ease-in-out;
  670. transition: all 1s ease-in-out;
  671. }
  672.  
  673. #info a:hover{
  674. color:{color:hover};
  675. -webkit-transition: all 1s ease-in-out;
  676. -moz-transition: all 1s ease-in-out;
  677. -o-transition: all 1s ease-in-out;
  678. -ms-transition: all 1s ease-in-out;
  679. transition: all 1s ease-in-out;
  680. }
  681. #info i:hover{
  682. color:{color:hover};
  683. -webkit-transition: all 1s ease-in-out;
  684. -moz-transition: all 1s ease-in-out;
  685. -o-transition: all 1s ease-in-out;
  686. -ms-transition: all 1s ease-in-out;
  687. transition: all 1s ease-in-out;
  688. }
  689.  
  690. #tags {
  691.  
  692. position:absolute;
  693. margin-top:5px;
  694. text-transform:uppercase;
  695. padding:5px;
  696. width:300px;
  697. margin-left:-40px;
  698. background:white;
  699. font-family:consolas;
  700. font-size:8px;
  701. {block:IndexPage}
  702. opacity:0;
  703. {/block:IndexPage}
  704. {block:PermalinkPage}
  705. opacity:1;
  706. {/block:PermalinkPage}
  707. color:{color:link};
  708. -webkit-transition: all 1s ease-in-out;
  709. -moz-transition: all 1s ease-in-out;
  710. -o-transition: all 1s ease-in-out;
  711. -ms-transition: all 1s ease-in-out;
  712. transition: all 1s ease-in-out;
  713. }
  714.  
  715. #tags a{
  716. color:{color:link};
  717. -webkit-transition: all 1s ease-in-out;
  718. -moz-transition: all 1s ease-in-out;
  719. -o-transition: all 1s ease-in-out;
  720. -ms-transition: all 1s ease-in-out;
  721. transition: all 1s ease-in-out;
  722. }
  723.  
  724. #tags a:hover{
  725. color:{color:hover};
  726. -webkit-transition: all 1s ease-in-out;
  727. -moz-transition: all 1s ease-in-out;
  728. -o-transition: all 1s ease-in-out;
  729. -ms-transition: all 1s ease-in-out;
  730. transition: all 1s ease-in-out;
  731. }
  732.  
  733. #stuff:hover #tags {
  734. opacity:1;
  735. -webkit-transition: all 1s ease-in-out;
  736. -moz-transition: all 1s ease-in-out;
  737. -o-transition: all 1s ease-in-out;
  738. -ms-transition: all 1s ease-in-out;
  739. transition: all 1s ease-in-out;
  740. }
  741.  
  742. #stuff:hover #info {
  743. opacity:1;
  744. -webkit-transition: all 1s ease-in-out;
  745. -moz-transition: all 1s ease-in-out;
  746. -o-transition: all 1s ease-in-out;
  747. -ms-transition: all 1s ease-in-out;
  748. transition: all 1s ease-in-out;
  749. }
  750.  
  751.  
  752. ol.notes {
  753. display:block;
  754. text-align:left;
  755. margin-bottom:30px;
  756. list-style-type:none;
  757. width:280px;
  758. text-transform:uppercase;
  759. padding:0px;
  760. font-size:8px;
  761. }
  762.  
  763. ol.notes li.note{
  764. padding:5px;
  765. padding-top:2px;
  766. margin-bottom:3px;
  767. font-size:8px;
  768.  
  769. }
  770. ol.notes img{
  771. display:none;
  772. }
  773.  
  774. .pagenotes {
  775. width:285px;
  776. text-align:left;
  777. background:white;
  778. padding:10px;
  779. margin-left:45px;
  780. }
  781. .pagenotes a{
  782. color:{color:text};
  783. }
  784.  
  785.  
  786. .pagenotes img{
  787. padding-right:5px;
  788. padding-top:5px;
  789. margin-bottom:-5px;
  790. border:none;
  791. padding-bottom:2px;
  792. opacity:0;
  793. }
  794.  
  795. .slide-ask {
  796. padding:10px;
  797. margin-left:-800px;
  798. opacity:0;
  799. overflow:hidden;
  800. -webkit-transition:opacity 1.6s;
  801. -moz-transition:opacity 1.6s;
  802. -ms-transition:opacity 1.6s;
  803. -o-transition:opacity 1.6s;
  804. transition:opacity 1.6s;
  805. }
  806.  
  807. .slide-link {
  808. margin-left:-800px;
  809. padding:10px;
  810. opacity:0;
  811. overflow:hidden;
  812. -webkit-transition:opacity 1.6s;
  813. -moz-transition:opacity 1.6s;
  814. -ms-transition:opacity 1.6s;
  815. -o-transition:opacity 1.6s;
  816. transition:opacity 1.6s;
  817. }
  818.  
  819. .slide-rules {
  820. margin-left:-800px;
  821. padding:10px;
  822. opacity:0;
  823. overflow:hidden;
  824. -webkit-transition:opacity 1.6s;
  825. -moz-transition:opacity 1.6s;
  826. -ms-transition:opacity 1.6s;
  827. -o-transition:opacity 1.6s;
  828. transition:opacity 1.6s;
  829. }
  830.  
  831. .periwink {
  832. width:480px;
  833. opacity:1;
  834. display:block;
  835. padding:10px;
  836. overflow:hidden;
  837. margin-left:90px;
  838. margin-top:-50px;
  839. -webkit-transition:opacity 1.6s;
  840. -moz-transition:opacity 1.6s;
  841. -ms-transition:opacity 1.6s;
  842. -o-transition:opacity 1.6s;
  843. transition:opacity 1.6s;
  844. }
  845.  
  846. #askbox {
  847.  
  848. background:-webkit-linear-gradient(top, {color:gradient1} 0%,
  849. {color:gradient2} 75%);
  850. overflow-y:hidden;
  851. overflow-x: hidden;
  852. position:fixed;
  853. height:490px;
  854. width:390px;
  855. z-index:999999999999;
  856. }
  857.  
  858. .star{
  859. padding:10px;
  860. border:1px solid {color:background};
  861. margin-top:10px;
  862. }
  863. .words{
  864. background:white;
  865. color:{color:text};
  866. padding:10px;
  867. line-height:1.5em;
  868. font-size:10px;
  869. font-family:consolas;
  870. letter-spacing:1px;
  871. text-transform:uppercase;
  872. }
  873. .navs{
  874. margin-left:20px;
  875. margin-top:20px;
  876. width:330px;
  877. height:auto;
  878. overflow:hidden;
  879. text-align:center;
  880. padding:16px;
  881. background:white;
  882. color:{color:text};
  883. font-family:consolas;
  884. text-transform:uppercase;
  885. font-size:9px;
  886. line-height:2em;
  887. letter-spacing:1px;
  888. -webkit-transition:all 1s ease;
  889. -moz-transition:all 1s ease;
  890. -ms-transition:all 1s ease;
  891. -o-transition:all 1s ease;
  892. transition:all 1s ease;
  893. }
  894.  
  895. .navs a{
  896. background:transparent;
  897. color:{color:text};
  898. margin:3px 3px;
  899. line-height:4em;
  900. padding:10px;
  901. border:1px solid {color:text};
  902. -webkit-transition:all 1s;
  903. -moz-transition:all 1s;
  904. -ms-transition:all 1s;
  905. -o-transition:all 1s;
  906. transition:all 1s;}
  907.  
  908. .navs a:hover{
  909. background:{color:accent};
  910. color:{color:background};
  911. letter-spacing:1px;
  912. border:1px solid {color:background};
  913. -webkit-transition:all 1s ease;
  914. -moz-transition:all 1s ease;
  915. -ms-transition:all 1s ease;
  916. -o-transition:all 1s ease;
  917. transition:all 1s ease;
  918. }
  919.  
  920. #desc{
  921. width:336px;
  922. margin-left:20px;
  923. background:{color:background};
  924. text-align:center;
  925. color:{color:text};
  926. padding:10px;
  927. line-height:1.5em;
  928. font-size:10px;
  929. font-family:consolas;
  930. letter-spacing:1px;
  931. text-transform:uppercase;}
  932.  
  933. #desc p{
  934. margin-left:15px;
  935. text-align:center;
  936. margin-left:0px;}
  937.  
  938.  
  939. .rules{
  940. width:300px;
  941. border:1px solid {color:background};
  942. background:white;
  943. padding:4px;
  944. font-family:consolas;
  945. text-transform:uppercase;
  946. line-height:1.5em;
  947. font-size:9px;
  948. color:{color:text};
  949. }
  950.  
  951. .slide-titles2{
  952. width:200px;
  953. padding:8px;
  954. font-size:12px;
  955. font-family: 'Lato', sans-serif;
  956. text-transform:uppercase;
  957. font-style:italic;
  958. letter-spacing:2px;
  959. background:transparent;
  960. color:{color:titles};
  961. }
  962.  
  963. .box-info{
  964. background:{color:background};
  965. padding:5px;
  966. font-family:consolas;
  967. text-transform:uppercase;
  968. line-height:1.4em;
  969. font-size:9px;
  970. color:{color:text};
  971. }
  972. .box-info a{
  973. color:{color:link};
  974. }
  975. .box-title{
  976. padding:8px;
  977. font-size:12px;
  978. font-family: 'Lato', sans-serif;
  979. text-transform:uppercase;
  980. font-style:italic;
  981. letter-spacing:3px;
  982. color:{color:background};
  983. }
  984.  
  985. .slide-titles{
  986. padding:8px;
  987. font-size:12px;
  988. font-family: 'Lato', sans-serif;
  989. text-transform:uppercase;
  990. font-style:italic;
  991. letter-spacing:3px;
  992. color:{color:titles};
  993. }
  994.  
  995. {block:ifTumblrControls}
  996. #tumblrcontrols{
  997. position:fixed;
  998. top:5px;
  999. right:10px;
  1000. word-spacing:10px;
  1001. }
  1002. #tumblrcontrols{
  1003. font-family:consolas;
  1004. font-size:9px;
  1005. letter-spacing:1px;
  1006. text-transform:uppercase;}
  1007.  
  1008. #tumblrcontrols a{
  1009. color:black;
  1010. }
  1011.  
  1012. #tumblrcontrols a:hover{
  1013. text-decoration:none;
  1014. color:{color:hover};}
  1015.  
  1016.  
  1017. #tumblrcontrols i{
  1018. font-size:11px;
  1019. margin-right:5px;
  1020. -moz-transition: all 0.8s ease;
  1021. -webkit-transition: all 0.8s ease;
  1022. transition: all 0.8s ease;
  1023. }
  1024.  
  1025. {block:IndexPage}
  1026. #tumblr_controls {display:none;}
  1027. {/block:IndexPage}
  1028.  
  1029. {block:PermalinkPage}
  1030. #tumblrcontrols{
  1031. display:none;}
  1032.  
  1033. iframe#tumblr_controls {
  1034. top:10px;
  1035. position: fixed !important;
  1036. right:20px !important;
  1037. -moz-transition: all 0.8s ease-out;
  1038. -webkit-transition: opacity 0.7s linear;
  1039. -webkit-transition: all 0.8s ease-out;
  1040. transition: all 0.8s ease-out;
  1041. opacity: 0.4;}
  1042.  
  1043. iframe#tumblr_controls:hover {
  1044. -webkit-transition: opacity 0.7s linear;
  1045. -moz-transition: all 0.4s ease-out;
  1046. -webkit-transition: all 0.4s ease-out;
  1047. transition: all 0.4s ease-out;
  1048. opacity:.7;}
  1049. {/block:PermalinkPage}
  1050. {/block:ifTumblrControls}
  1051. {CustomCSS}
  1052. </style>
  1053. </head>
  1054. <body>
  1055.  
  1056. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  1057. {block:ifTumblrControls}
  1058. <div id="tumblrcontrols">
  1059. <a href="http://www.tumblr.com/follow/{text:url}"><i style="color:black;" class="fa fa-plus"></i>follow</a>
  1060. <a href="http://www.tumblr.com/dashboard"><i style="color:black;" class="fa fa-list-alt"></i>dashboard</a>
  1061. </div>{/block:ifTumblrControls}
  1062. <div id="container">
  1063. <div id="blogt"> <a href="/">{Title}</a>
  1064. </div>
  1065. <div id="contains">
  1066.  
  1067. <div id="askbox" class="slide-rules">
  1068. <br>
  1069. <center>
  1070. <!---Type out your updates here. You can change everything about this section to fit your needs. Try not to make it too long or it will mess with the whole slide out page thing. --->
  1071. <big class="slide-titles2">about me</big>
  1072. <p class="rules">Type out a mini about me here!</p>
  1073.  
  1074. <big class="slide-titles2">best friends</big>
  1075. <p class="rules">You can link to all your friends and stuff here!</p>
  1076.  
  1077. <big class="slide-titles2">networks<br></big>
  1078. <p class="rules">list out all your networks here</p>
  1079.  
  1080. <big class="slide-titles2">awards</big>
  1081. <p class="rules">your tumblr award winners/botm/ any other prize winners can be displayed here!</p>
  1082.  
  1083. <big class="slide-titles2">anything you want</big>
  1084. <p class="rules">yay another box for something you want!</p>
  1085.  
  1086. </center>
  1087. </div>
  1088. <div id="askbox" class="slide-ask">
  1089. <br>
  1090. <div class="ask-box">
  1091. <big class="slide-titles">FAQ & ASK</big>
  1092. <p class="box-info">
  1093. {text:FAQ Here}</p>
  1094.  
  1095.  
  1096. </div>
  1097. <div class="star"><iframe frameborder="0" height="200px" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/{text:url}.tumblr.com" width="96%"></iframe></div>
  1098. </div>
  1099. <div id="askbox" class="slide-link">
  1100. <br>
  1101. <div id="desc"><p>{description}</p></div>
  1102.  
  1103. <div class="navs">
  1104. <a href="{text:link1 url}">{text:link 1}</a>
  1105. <a href="{text:link2 url}">{text:link 2}</a>
  1106. <a href="{text:link3 url}">{text:link 3}</a>
  1107. <a href="{text:link4 url}">{text:link 4}</a>
  1108. <a href="{text:link5 url}">{text:link 5}</a>
  1109. <a href="{text:link6 url}">{text:link 6}</a>
  1110. <a href="{text:link7 url}">{text:link 7}</a>
  1111. <a href="{text:link8 url}">{text:link 8}</a>
  1112.  
  1113. </div>
  1114.  
  1115. <!---you can add more links by copying this entire little bit and copying it again.--->
  1116. {block:ifDoubleLinks}
  1117. <div class="navs">
  1118.  
  1119. <a href="{text:link9 url}">{text:link 9}</a>
  1120. <a href="{text:link10 url}">{text:link 10}</a>
  1121. <a href="{text:link11 url}">{text:link 11}</a>
  1122. <a href="{text:link12 url}">{text:link 12}</a>
  1123. <a href="{text:link13 url}">{text:link 13}</a>
  1124. <a href="{text:link14 url}">{text:link 14}</a>
  1125. <a href="{text:link15 url}">{text:link 15}</a>
  1126. <a href="{text:link16 url}">{text:link 16}</a>
  1127. </div> {/block:ifDoubleLinks}
  1128. <!---end extra links--->
  1129. </div>
  1130. <div id="tops">
  1131. <div id="link">
  1132. <a href="/">index</a><br>
  1133. <a class="button">message</a><br>
  1134. <a class="button3">updates</a><br>
  1135. <a class="button2">navigate</a><br>
  1136. <a href="http://trenzalours.tumblr.com/">credit</a><br>
  1137. {block:Pagination}
  1138. {block:PreviousPage}<a href="{PreviousPage}" title="reverse">- </a>{/block:PreviousPage}
  1139. {block:NextPage}<a href="{NextPage}" title="forward"> +</a>{/block:NextPage}
  1140. {/block:Pagination}
  1141. </div>
  1142. </div>
  1143.  
  1144. <div id="entries">
  1145. {block:Posts}
  1146. <div id="stuff">
  1147.  
  1148. {block:Quote}
  1149.  
  1150.  
  1151. <div id="titlequote">{Quote}</div>
  1152. {block:Source}<div id="source">{Source}</div>{/block:Source}
  1153. {/block:Quote}
  1154.  
  1155.  
  1156.  
  1157. {block:Text}
  1158.  
  1159. {block:Title}
  1160. <div id="title">{Title}</div>{/block:Title}
  1161. <div id="annoy">{Body}</div>
  1162. {/block:Text}
  1163.  
  1164. {block:Link}
  1165. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  1166. {/block:Link}
  1167.  
  1168. {block:Chat}
  1169. {block:Title}
  1170. <h1>{Title}</h1>
  1171. {/block:Title}
  1172. <div class="chat">
  1173. <ol>{block:Lines}
  1174. <li class="line {Alt}">
  1175. {block:Label}
  1176. <span class="label">
  1177. {Label}</span>
  1178. {/block:Label}{Line}</li>
  1179. {/block:Lines}
  1180. </ol></div>
  1181. {/block:Chat}
  1182.  
  1183. {block:Photo}
  1184.  
  1185. <img src="{PhotoURL-250}">
  1186. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1187.  
  1188. {/block:Photo}
  1189.  
  1190. {block:Photoset}
  1191. {Photoset-250}
  1192. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1193. {/block:Photoset}
  1194.  
  1195. {block:Video}
  1196. {Video-250}
  1197. {block:permalink}{block:Caption}{Caption}{/block:Caption}{/block:permalink}
  1198. {/block:Video}
  1199.  
  1200. {block:Audio}
  1201. <div id="audios">
  1202. <div class="player">{AudioPlayerWhite}</div>
  1203. <div class="audioinfo">
  1204. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  1205. </div>
  1206. </div>
  1207. {/block:Audio}
  1208.  
  1209.  
  1210. {block:Answer}
  1211. <div class="q">
  1212. <div class="lady">{Asker}:</div>
  1213. <div class="as">{Question}</div>
  1214. <div class="a">{Answer}</div>
  1215. </div>
  1216. {/block:Answer}
  1217.  
  1218.  
  1219.  
  1220. {block:Date}
  1221. <div id="info">
  1222.  
  1223. <a href="{Permalink}">
  1224. {block:Date}
  1225. {TimeAgo}
  1226. {/block:Date}
  1227.  
  1228. </a> {block:NoteCount}
  1229. | <a href="{Permalink}" title="{NoteCount}"><i class="fa fa-heart-o"></i></a>{/block:NoteCount}
  1230. {block:RebloggedFrom}
  1231. <a href="{ReblogParentURL}" title="via"><i class="fa fa-folder-o fa-lg"></i></a> {/block:RebloggedFrom}
  1232. {block:ContentSource}
  1233. <a href="{SourceURL}" title="source"><i class="fa fa-floppy-o fa-lg"></i></a>{/block:ContentSource}
  1234.  
  1235.  
  1236. <div id="tags">
  1237. {block:HasTags}
  1238. {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}
  1239. {/block:HasTags}
  1240. </div>
  1241.  
  1242. </div></div>
  1243.  
  1244.  
  1245. {block:PostNotes}
  1246. <div class="pagenotes">{PostNotes-16}</div>{/block:PostNotes}
  1247. {/block:Posts}
  1248.  
  1249.  
  1250. </div>
  1251. </div>
  1252.  
  1253.  
  1254.  
  1255. {block:ContentSource}
  1256. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1257. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1258. {/block:SourceLogo}
  1259. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1260. {/block:ContentSource}
  1261. </body>
  1262.  
  1263. </script>
  1264. </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!