Advertisement
trenzalours

theme 14 - apollo

Aug 8th, 2014
2,269
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.43 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  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=Carrois+Gothic+SC' rel='stylesheet' type='text/css'>
  6. <title>{Title}</title>
  7.  
  8. <link rel="shortcut icon" href="{Favicon}">
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  10. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  11.  
  12. <!---||||||||||~* ᴛʀᴇɴᴢᴀᴛʜᴇᴍᴇs ﹣ ᴛʀᴇɴᴢᴀʟᴏᴜʀs *~||||||||||--->
  13.  
  14. <!-- *META TAGS* -->
  15.  
  16. <meta name="color:Background" content="#ffffff"/>
  17. <meta name="color:Text" content="#363333"/>
  18. <meta name="color:header" content="#363333"/>
  19. <meta name="color:Link" content="#363333"/>
  20. <meta name="color:Accent" content="#f1f1f1">
  21. <meta name="if:Night" content="0">
  22. <meta name="if:500pxPosts" content="0">
  23. <meta name="if:250pxPosts" content="1">
  24. <meta name="if:400pxPosts" content="0">
  25.  
  26. <meta name="text:url" content="url here" />
  27.  
  28. <meta name="image:Background Image" content="http://i61.tinypic.com/wqxc9y.png"/>
  29.  
  30. <meta name="text:Link 1" content="" />
  31. <meta name="text:Link 1 URL" content="" />
  32. <meta name="text:Link 2" content="" />
  33. <meta name="text:Link 2 URL" content="" />
  34. <meta name="text:Link 3" content="" />
  35. <meta name="text:Link 3 URL" content="" />
  36. <meta name="text:Link 4" content="" />
  37. <meta name="text:Link 4 URL" content="" />
  38.  
  39.  
  40.  
  41.  
  42. <!-- *TOOLTIPS* -->
  43.  
  44. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  45.  
  46. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  47.  
  48. <script>
  49.  
  50. (function($){
  51.  
  52. $(document).ready(function(){
  53.  
  54. $("a[title]").style_my_tooltips({
  55.  
  56. tip_follows_cursor:true,
  57.  
  58. tip_delay_time:30,
  59.  
  60. tip_fade_speed:300,
  61.  
  62. attribute:"title"
  63.  
  64. });
  65.  
  66. });
  67.  
  68. })(jQuery);
  69.  
  70. </script>
  71.  
  72.  
  73.  
  74. <!--side push menu from codrops-->
  75. <!--don't touch-->
  76. <script src="http://takien.github.io/jPushMenu/js/jquery-1.9.1.min.js"></script>
  77. <script src="http://takien.github.io/jPushMenu/js/jPushMenu.js"></script>
  78.  
  79. <!--call jPushMenu, required-->
  80. <script>
  81. jQuery(document).ready(function($) {
  82. $('.toggle').jPushMenu();
  83. });
  84. </script>
  85. <!---Scroll to top--->
  86. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  87. <script type="text/javascript">
  88. var scrolltotop={
  89. setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
  90. controlHTML: '<a style="font-size:14px; href="#" title="to top">&Delta;</a>',
  91. controlattrs: {offsetx:18, offsety:6},
  92. state: {isvisible:false, shouldvisible:false},
  93.  
  94. scrollup:function(){
  95. if (!this.cssfixedsupport)
  96. this.$control.css({opacity:0})
  97. var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
  98. if (typeof dest=="string" && jQuery('#'+dest).length==1)
  99. dest=jQuery('#'+dest).offset().top
  100. else
  101. dest=0
  102. this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
  103. },
  104.  
  105. keepfixed:function(){
  106. var $window=jQuery(window)
  107. var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
  108. var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
  109. this.$control.css({left:controlx+'px', top:controly+'px'})
  110. },
  111.  
  112. togglecontrol:function(){
  113. var scrolltop=jQuery(window).scrollTop()
  114. if (!this.cssfixedsupport)
  115. this.keepfixed()
  116. this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
  117. if (this.state.shouldvisible && !this.state.isvisible){
  118. this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
  119. this.state.isvisible=true
  120. }
  121. else if (this.state.shouldvisible==false && this.state.isvisible){
  122. this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
  123. this.state.isvisible=false
  124. }
  125. },
  126.  
  127. init:function(){
  128. jQuery(document).ready(function($){
  129. var mainobj=scrolltotop
  130. var iebrws=document.all
  131. mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest
  132. mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
  133. mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
  134. .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
  135. .attr({title:''})
  136. .click(function(){mainobj.scrollup(); return false})
  137. .appendTo('body')
  138. if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='')
  139. mainobj.$control.css({width:mainobj.$control.width()})
  140. mainobj.togglecontrol()
  141. $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
  142. mainobj.scrollup()
  143. return false
  144. })
  145. $(window).bind('scroll resize', function(e){
  146. mainobj.togglecontrol()
  147. })
  148. })
  149. }
  150. }
  151.  
  152. scrolltotop.init()</script>
  153.  
  154.  
  155. <!-- *BEGIN CSS* -->
  156.  
  157. <style type="text/css">
  158.  
  159. *, #links a:hover {
  160. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  161. }
  162.  
  163. *, #sidebar a:hover {
  164. cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif), auto;
  165. }
  166.  
  167. *, body a:hover {
  168. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  169. }
  170.  
  171.  
  172. /* SELECTION */
  173.  
  174. ::selection {
  175. background-color:{color:header};
  176. color:white;}
  177.  
  178. /* SCROLLBAR */
  179.  
  180. ::-webkit-scrollbar {
  181. background-color:transparent;
  182. height:10px;
  183. width:10px;}
  184.  
  185. ::-webkit-scrollbar-thumb:vertical {
  186. background:{color:accent};
  187. height:10px;}
  188.  
  189. ::-webkit-scrollbar-thumb:horizontal {
  190. background-color:transparent;
  191. height:10px!important;}
  192.  
  193.  
  194. /* TOOPTIP CSS */
  195. #s-m-t-tooltip{
  196. padding:4px;
  197. position:absolute;
  198. margin: 20px 20px;
  199. z-index: 99999999999;
  200. text-transform:uppercase;
  201. letter-spacing:1px;
  202. font-family:consolas;
  203. font-size:8px;
  204. background: url({image:Background Image}) no-repeat right bottom;
  205. color:{color:background};}
  206.  
  207.  
  208.  
  209. /* GENERAL */
  210.  
  211. blockquote {
  212. padding:5px 0 5px 30px;
  213. border-left:1px solid {color:text};
  214. margin-left:30px;}
  215.  
  216.  
  217.  
  218. body {
  219. background:{color:background};
  220. color:{color:text};
  221. font-family:calibri;
  222. font-size:11px;
  223. text-align:justify;
  224. margin:0;
  225. line-height:1.5em;}
  226.  
  227.  
  228.  
  229. a {
  230. color:{color:accent};
  231. text-decoration:none;}
  232.  
  233. a:hover {
  234. text-decoration:underline;
  235. color:{color:accent};
  236. text-shadow:0px 0px 1px {color:accent};
  237. -webkit-transition: all 1s ease-in-out;
  238. -moz-transition: all 1s ease-in-out;
  239. -o-transition: all 1s ease-in-out;
  240. transition: all 1s ease-in-out;}
  241.  
  242.  
  243. img{
  244. opacity:1;
  245. border:none;
  246. text-decoration:none}
  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. small {
  263. font-size:9px;}
  264.  
  265. big {
  266. font-size:12px;}
  267.  
  268. h1{
  269. color:{color:text};
  270. font-size:14px;
  271. font-weight:none;
  272. }
  273.  
  274.  
  275. li{
  276. color:{color:text};
  277. margin-bottom:3px;
  278. list-style-type:none;
  279. background:{color:background};
  280. padding:5px;
  281. font-family:consolas;
  282. font-size:9px;
  283. text-transform:uppercase;}
  284.  
  285. pre{
  286. background:{color:background};
  287. padding:10px;
  288. color:{color:text};
  289. font-family:consolas;
  290. text-transform:uppercase;
  291. font-size:9px;
  292. letter-spacing:1px;
  293. white-space: pre-wrap;
  294. white-space: -moz-pre-wrap;
  295. white-space: -pre-wrap;
  296. white-space: -o-pre-wrap;
  297. word-wrap: break-word;}
  298.  
  299. code{
  300. font-weight:bold;
  301. text-transform:lowercase;
  302. font-style:italic;
  303. }
  304.  
  305.  
  306. #title {
  307. background:{color:background};
  308. padding:10px;
  309. font-size:12px;
  310. line-height:18px;
  311. font-weight:none;
  312. margin-bottom:10px;
  313. text-transform:uppercase;
  314. letter-spacing:2px;
  315. font-family: 'Carrois Gothic SC', sans-serif;
  316. text-align:left;}
  317.  
  318.  
  319.  
  320.  
  321.  
  322.  
  323. /* SIDEBAR */
  324.  
  325. #stuffs{
  326. width:168px;
  327. height:240px;
  328. padding:30px;
  329. margin-left:10px;
  330. margin-top:197px;
  331. text-align:left;
  332. -webkit-transition: all 1s ease-in;
  333. -moz-transition: all 1s ease-in;
  334. -o-transition: all 1s ease-in;
  335. transition: all 1s ease-in;}
  336.  
  337.  
  338. #sidebar:hover #blogt{
  339. border-bottom:2px solid {color:header};
  340. border-left:2px solid {color:header};
  341. border-right:2px solid {color:header};
  342. color:{color:text};
  343. background:white;
  344. opacity:.84;
  345. }
  346.  
  347. #sidebar:hover #blogt a{
  348. color:{color:accent};
  349. text-decoration:none;
  350. letter-spacing:3px;
  351. text-shadow:0px 0px 2px {color:accent};
  352. -webkit-transition: all .7s ease;
  353. -moz-transition: all 1.7s ease;
  354. -o-transition: all .7s ease;
  355. transition: all .7s ease;}
  356.  
  357.  
  358. #sidebar:hover #description{
  359. border-top:2px solid {color:header};
  360. border-left:2px solid {color:header};
  361. border-right:2px solid {color:header};
  362. border-bottom:2px solid {color:header};
  363. color:{color:text};
  364. background:white;
  365. opacity:.84;
  366. -webkit-transition: all 1s ease-out;
  367. -moz-transition: all 1s ease-out;
  368. -o-transition: all 1s ease-out;
  369. transition: all 1s ease-out;}
  370.  
  371. #sidebar {
  372. padding:20px;
  373. text-align:center;
  374. position:fixed;
  375. width:140px;
  376. height:100%;
  377. width:20%;
  378. left:0;
  379. background: url({image:Background Image})
  380. no-repeat center center fixed;
  381. -webkit-background-size: cover;
  382. -moz-background-size: cover;
  383. -o-background-size: cover;
  384. background-size: cover;}
  385.  
  386.  
  387. #blogt{
  388. width:135px;
  389. overflow:hidden;
  390. letter-spacing:2px;
  391. {block:ifNight}
  392. border-bottom:2px solid {color:header};
  393. border-left:2px solid {color:header};
  394. border-right:2px solid {color:header};
  395. color:{color:header};{/block:ifNight}
  396. {block:ifnotNight}
  397. border-bottom:2px solid white;
  398. border-left:2px solid white;
  399. border-right:2px solid white;
  400. color:white;{/block:ifnotNight}
  401. font-family: 'Carrois Gothic SC', sans-serif;
  402. padding:20px;
  403. text-align:center;
  404. font-size:20px;
  405. font-weight:none;
  406. -webkit-transition: all .7s ease;
  407. -moz-transition: all 1.7s ease;
  408. -o-transition: all .7s ease;
  409. transition: all .7s ease;}
  410.  
  411. #blogt a{
  412. {block:ifNight}
  413. color:{color:header};
  414. {/block:ifNight}
  415. {block:ifnotNight}
  416. color:white;
  417. {/block:ifnotNight}
  418. }
  419.  
  420. #blogt a:hover{
  421. text-decoration:none;
  422. color:{color:accent};
  423. letter-spacing:1px;
  424. -webkit-transition: all .7s ease;
  425. -moz-transition: all 1.7s ease;
  426. -o-transition: all .7s ease;
  427. transition: all .7s ease;}
  428.  
  429.  
  430. #links {
  431. padding:10px;
  432. text-transform:lowercase;
  433. text-align:center;
  434. margin-left:10px;
  435. }
  436.  
  437.  
  438. #links a {
  439. color:{color:background};
  440. margin-right:5px;
  441. width:5px;
  442. height:5px;
  443. display:inline-block;
  444. {block:ifNight}
  445. border:1px solid {color:header};
  446. {/block:ifNight}
  447. {block:ifnotNight}
  448. border:1px solid {color:background};
  449. {/block:ifnotNight}
  450. padding:3px;
  451. -webkit-transition: all 1s ease-out;
  452. -moz-transition: all 1s ease-out;
  453. -o-transition: all 1s ease-out;
  454. transition: all 1s ease-out;}
  455.  
  456. #links a:hover{
  457. background:{color:background};
  458. -webkit-transition: all 1s ease;
  459. -moz-transition: all 1s ease;
  460. -o-transition: all 1s ease;
  461. transition: all 1s ease;}
  462.  
  463.  
  464. #description {
  465. width:135px;
  466. max-height:100px;
  467. overflow:hidden;
  468. letter-spacing:1px;
  469. text-transform:uppercase;
  470. font-family:consolas;
  471. font-size:9px;
  472. {block:ifNight}
  473. border-top:2px solid {color:header};
  474. border-left:2px solid {color:header};
  475. border-right:2px solid {color:header};
  476. border-bottom:2px solid {color:header};
  477. color:{color:header};
  478. color:{color:header};{/block:ifNight}
  479. {block:ifnotNight}
  480. border-top:2px solid white;
  481. border-left:2px solid white;
  482. border-right:2px solid white;
  483. border-bottom:2px solid white;
  484. color:white;
  485. color:white;{/block:ifnotNight}
  486. padding:20px;
  487. text-align:center;
  488. -webkit-transition: all 1s ease;
  489. -moz-transition: all 1s ease;
  490. -o-transition: all 1s ease;
  491. transition: all 1s ease;
  492. }
  493.  
  494.  
  495.  
  496. /*container*/
  497. #con {
  498. left:50%;
  499. margin-left:-400px;
  500. position:absolute;
  501. }
  502.  
  503.  
  504.  
  505.  
  506.  
  507. /*---------------*/
  508. /***** POSTS *****/
  509. /*---------------*/
  510.  
  511. #entries {
  512. padding:10px;
  513. width:500px;
  514. margin-left:150px;
  515. margin-top:40px;
  516. }
  517.  
  518.  
  519. /*/ POSTS /*/
  520.  
  521.  
  522. #stuff {
  523. padding:10px;
  524. margin-bottom:100px;
  525. border:1px solid {color:header};
  526. {block:if250pxPosts}width:250px;{/block:if250pxPosts}
  527. {block:if500pxPosts}width:500px;{/block:if500pxPosts}
  528. {block:if400pxPosts}width:400px;{/block:if400pxPosts}
  529. text-align:justify;
  530. font-size:11px;
  531. line-height:100%;
  532. letter-spacing:0x;
  533. color:{color:text};
  534. background:white;
  535.  
  536. }
  537.  
  538. #stuff img, #stuff li, #stuff blockquote {
  539. max-width: 100%;}
  540.  
  541.  
  542.  
  543.  
  544. /*quote*/
  545.  
  546. #titlequote{
  547. font-family: 'Carrois Gothic SC', sans-serif;
  548. border:1px solid {color:header};
  549. background:white;
  550. letter-spacing:1px;
  551. text-align:left;
  552. font-size:13px;
  553. line-height:19px;
  554. font-weight:none;
  555. padding:10px;
  556. }
  557.  
  558.  
  559.  
  560.  
  561. #source {
  562. text-align:right;
  563. font-style:italic;
  564. font-weight:none;
  565. text-transform:uppercase;
  566. font-family:consolas;
  567. font-size:9px;
  568. letter-spacing:1px;
  569. margin-top:15px;
  570. margin-left:15px;
  571. color:{color:text};
  572. }
  573. #source a{
  574. color{color:text};
  575. }
  576.  
  577.  
  578.  
  579.  
  580.  
  581. #audios{
  582. border:1px solid {color:header};
  583. background:white;
  584. padding:10px;
  585. color:{color:text};
  586. }
  587.  
  588. .player {
  589. width:25px;
  590. height:25px;
  591. overflow:hidden;
  592. position:absolute;
  593. color:{color:text};
  594. background:white;}
  595.  
  596. .audioinfo {
  597. color:{color:text};
  598. margin-left:50px;
  599. background:white;
  600. }
  601.  
  602.  
  603. /*asks*/
  604. .q {
  605. margin-bottom:10px;
  606. text-transform:uppercase;
  607. font-family:consolas;
  608. font-size:9px;
  609. letter-spacing:1px;}
  610.  
  611. .as {
  612. font-weight:bold;
  613. background:white;
  614. padding:10px;}
  615.  
  616.  
  617. .a {
  618. margin-top:10px;
  619. padding:10px;
  620. letter-spacing:1px;
  621. text-transform:uppercase;
  622. background:{color:header};
  623. color:white;
  624. font-family:consolas;
  625. font-size:9px;}
  626.  
  627. .a em,b,strong,i,a{
  628. color:{color:accent};
  629. }
  630.  
  631.  
  632.  
  633.  
  634.  
  635. /*chat*/
  636.  
  637. .chat ol {
  638. padding:0;
  639. list-style:none;
  640. }
  641. .line {padding:5px 0;}
  642.  
  643. .label {font-weight:bold;
  644. }
  645.  
  646.  
  647. /*/ NOTES /*/
  648.  
  649.  
  650. #info {
  651. opacity:0;
  652. position:absolute;
  653. {block:if250pxPosts}width:250px;{/block:if250pxPosts}
  654. {block:if500pxPosts}width:500px;{/block:if500pxPosts}
  655. {block:if400pxPosts}width:400px;{/block:if400pxPosts}
  656. text-transform:uppercase;
  657. font-family:consolas;
  658. font-size:9px;
  659. letter-spacing:1px;
  660. line-height:10px;
  661. color:{color:link};
  662. margin-top:20px;
  663. text-align:left;
  664. -webkit-transition: all 1s ease-in;
  665. -moz-transition: all 1s ease-in;
  666. -o-transition: all 1s ease-in;
  667. -ms-transition: all 1s ease-in;
  668. transition: all 1s ease-in;
  669. }
  670.  
  671. #inforight{
  672. float:right;
  673. text-align:right;
  674. margin-left:-10px;
  675. -webkit-transition: all 1s ease-out;
  676. -moz-transition: all 1s ease-out;
  677. -o-transition: all 1s ease-out;
  678. -ms-transition: all 1s ease-out;
  679. transition: all 1s ease-out;
  680. }
  681.  
  682. #info a{
  683. color:{color:link};
  684. -webkit-transition: all 1s ease-in-out;
  685. -moz-transition: all 1s ease-in-out;
  686. -o-transition: all 1s ease-in-out;
  687. -ms-transition: all 1s ease-in-out;
  688. transition: all 1s ease-in-out;
  689. }
  690.  
  691. #info i{
  692. font-size:10px;
  693. padding:5px;
  694. color:{color:link};
  695. -webkit-transition: all 1s ease-in-out;
  696. -moz-transition: all 1s ease-in-out;
  697. -o-transition: all 1s ease-in-out;
  698. -ms-transition: all 1s ease-in-out;
  699. transition: all 1s ease-in-out;
  700. }
  701.  
  702. #info a:hover{
  703. text-decoration:none;
  704. color:{color:header};
  705. letter-spacing:1px;
  706. text-shadow:0px 0px 1px
  707. {color:header};
  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. #info i:hover{
  715. text-decoration:none;
  716. color:{color:header};
  717. letter-spacing:1px;
  718. text-shadow:0px 0px 1px
  719. {color:header};
  720. -webkit-transition: all 1s ease-in-out;
  721. -moz-transition: all 1s ease-in-out;
  722. -o-transition: all 1s ease-in-out;
  723. -ms-transition: all 1s ease-in-out;
  724. transition: all 1s ease-in-out;
  725. }
  726.  
  727. #tags {
  728. position:absolute;
  729. margin-top:10px;
  730. text-transform:uppercase;
  731. font-family:consolas;
  732. font-size:8px;
  733. margin-left:10px;
  734. opacity:0;
  735. color:{color:text};
  736. -webkit-transition: all 1s ease-in-out;
  737. -moz-transition: all 1s ease-in-out;
  738. -o-transition: all 1s ease-in-out;
  739. -ms-transition: all 1s ease-in-out;
  740. transition: all 1s ease-in-out;
  741. }
  742.  
  743. #tags a{
  744. color:{color:text};
  745. -webkit-transition: all 1s ease-in-out;
  746. -moz-transition: all 1s ease-in-out;
  747. -o-transition: all 1s ease-in-out;
  748. -ms-transition: all 1s ease-in-out;
  749. transition: all 1s ease-in-out;
  750. }
  751.  
  752. #tags a:hover{
  753. color:{color:accent};
  754. -webkit-transition: all 1s ease-in-out;
  755. -moz-transition: all 1s ease-in-out;
  756. -o-transition: all 1s ease-in-out;
  757. -ms-transition: all 1s ease-in-out;
  758. transition: all 1s ease-in-out;
  759. }
  760.  
  761. #stuff:hover #tags {
  762. opacity:.8;
  763. margin-left:0px;
  764. -webkit-transition: all 1s ease-in-out;
  765. -moz-transition: all 1s ease-in-out;
  766. -o-transition: all 1s ease-in-out;
  767. -ms-transition: all 1s ease-in-out;
  768. transition: all 1s ease-in-out;
  769. }
  770.  
  771. #stuff:hover #info {
  772. opacity:1;
  773. margin-left:0px;
  774. -webkit-transition: all 1s ease-in-out;
  775. -moz-transition: all 1s ease-in-out;
  776. -o-transition: all 1s ease-in-out;
  777. -ms-transition: all 1s ease-in-out;
  778. transition: all 1s ease-in-out;
  779. }
  780.  
  781. ol.notes {
  782. display:block;
  783. text-align:left;
  784. margin-bottom:30px;
  785. list-style-type:none;
  786. {block:if250pxPosts}width:250px;{/block:if250pxPosts}
  787. {block:if500pxPosts}width:500px;{/block:if500pxPosts}
  788. {block:if400pxPosts}width:400px;{/block:if400pxPosts}
  789. margin-left:10px;
  790. padding:0px;
  791. }
  792.  
  793. ol.notes li.note{
  794. padding:5px;
  795. padding-top:2px;
  796. margin-bottom:3px;
  797. }
  798.  
  799. .pagenotes {
  800. text-align:left;
  801. background:transparent;
  802. text-transform:uppercase;
  803. font-size:9px;
  804. }
  805.  
  806.  
  807. .pagenotes img{
  808. padding-right:5px;
  809. padding-top:5px;
  810. margin-bottom:-5px;
  811. border:none;
  812. padding-bottom:2px;
  813. }
  814.  
  815. .cbp-spmenu {
  816. position: fixed;
  817. }
  818.  
  819.  
  820. /* Orientation-dependent styles for the content of the menu */
  821.  
  822. .cbp-spmenu-horizontal {
  823. padding-bottom:10px;
  824. padding:10px;
  825. margin-left:1050px;
  826. text-align:justify;
  827. font-size:10px;
  828. background:url({image:Background Image})
  829. no-repeat center center fixed;
  830. -webkit-background-size: cover;
  831. -moz-background-size: cover;
  832. -o-background-size: cover;
  833. background-size: cover;
  834. color:{color:background};
  835. width: 300px;
  836. height: 100%;
  837. }
  838.  
  839.  
  840.  
  841. /* Horizontal menu that slides from the top or bottom */
  842.  
  843. .cbp-spmenu-bottom {
  844. right: -400px;
  845. }
  846.  
  847. .cbp-spmenu-bottom.cbp-spmenu-open {
  848. bottom:0px;
  849. right:0px;
  850. }
  851.  
  852.  
  853.  
  854.  
  855. /* Transitions */
  856.  
  857. .cbp-spmenu,
  858. .cbp-spmenu-push {
  859. -webkit-transition: all 0.3s ease;
  860. -moz-transition: all 0.3s ease;
  861. transition: all 0.3s ease;
  862. }
  863.  
  864.  
  865.  
  866. .pushtitle {
  867. margin-top:20px;
  868. font-family: 'Carrois Gothic SC', sans-serif;
  869. text-align:center;
  870. color:{color:title};
  871. font-size:12px;
  872. margin-bottom:5px;
  873. letter-spacing:2px;
  874. text-transform:uppercase;
  875. }
  876.  
  877.  
  878. #pushdescription {
  879. line-height:14px;
  880. padding:20px;
  881. overflow-y:scroll;
  882. overflow-x:hidden;
  883.  
  884. }
  885.  
  886.  
  887.  
  888.  
  889. /*container*/
  890. #container {
  891. top:50%;
  892. margin-left:-225px;
  893. position:absolute;
  894. z-index:999999999999999999999999999;
  895. }
  896. .cbp-spmenu {
  897. position: fixed;
  898. }
  899.  
  900. .rules{
  901. border:1px solid {color:header};
  902. background:white;
  903. padding:4px;
  904. font-family:consolas;
  905. text-transform:uppercase;
  906. line-height:1.5em;
  907. font-size:9px;
  908. color:{color:text};
  909. }
  910. .rue{
  911. padding:8px;
  912. font-size:12px;
  913. font-family: 'Carrois Gothic SC', sans-serif;
  914. text-transform:uppercase;
  915. letter-spacing:1px;
  916. color:white;
  917. }
  918.  
  919.  
  920. /* Orientation-dependent styles for the content of the menu */
  921.  
  922. .cbp-spmenu-vertical {
  923. padding-bottom:10px;
  924. padding:10px;
  925. margin-left:1050px;
  926. text-align:justify;
  927. font-size:10px;
  928. background:url({image:Background Image})
  929. no-repeat center center fixed;
  930. -webkit-background-size: cover;
  931. -moz-background-size: cover;
  932. -o-background-size: cover;
  933. background-size: cover;
  934. color:{color:background};
  935. width: 300px;
  936. height: 100%;
  937. z-index:999999999999999999999999999;
  938. }
  939.  
  940. /* Vertical menu that slides from the right or right */
  941.  
  942.  
  943.  
  944. .cbp-spmenu-right {
  945. right: -400px;
  946. }
  947.  
  948.  
  949. .cbp-spmenu-right.cbp-spmenu-open {
  950. right: 0px;
  951. }
  952.  
  953.  
  954. /*/ PAGINATION /*/
  955.  
  956. #pagi {
  957.  
  958. margin-left:-100px;
  959. margin-top:10px;
  960. padding:15px;
  961. width:auto;
  962. text-align:center;
  963. margin-bottom:30px;
  964. font-size:10px;
  965. font-family:consolas;
  966. text-transform:uppercase;
  967. z-index:100;
  968.  
  969. }
  970.  
  971. {CustomCSS}
  972.  
  973.  
  974. </style>
  975. </head><body>
  976.  
  977. <!---BEGIN HTML--->
  978.  
  979. <div id="con">
  980. <div id="sidebar">
  981. <div id="stuffs">
  982. <div id="description">{Description}</div>
  983. <div id="blogt"><a href="/">{Title}</a></div>
  984. <div id="links">
  985. <a href="/" title="index"></a>
  986. <a title="message" class="toggle menu-bottom"></a></a>
  987. {block:ifLink1}
  988. <a href="{text:Link 1 URL}" title="{text:Link 1}"></a>{/block:ifLink1}
  989. {block:ifLink2}<a href="{text:Link 2 URL}" title="{text:Link 2}"></a>{/block:ifLink2}
  990. {block:ifLink3}<a href="{text:Link 3 URL}" title="{text:Link 3}"></a>{/block:ifLink3}
  991. {block:ifLink4}<a title="{text:Link 4}" class="{text:Link 4}"></a></a>{/block:ifLink4}
  992. <a href="http://trenzalours.co.vu/" title="theme"></a>
  993. </div>
  994. </div>
  995. </div>
  996. <body class="cbp-spmenu-push">
  997.  
  998. <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom" id="cbp-spmenu-s1">
  999. <div class="menu" >
  1000. <div class="pushtitle">
  1001. </div>
  1002. <div id="pushdescription"><div style="padding:5px;">
  1003. <big class="rue">FAQ & ASK</big>
  1004. <br>
  1005. <p class="rules">
  1006. Type in your FAQ here. You can copy these classes to create more boxes. If you want to create another title copy the rue class and paste where you need it. This will have a scroll on it if you go over the height.</p>
  1007. <!---
  1008. <big class="rue">title here</big>
  1009. <p class="rules">Rule goes here<br></p>
  1010. --->
  1011. <center>
  1012. <iframe frameborder="0" height="250" id="ask_form" scrolling="none" src="http://www.tumblr.com/ask_form/{text:url}.tumblr.com" width="100%"> </iframe>
  1013. <p></p>
  1014. </center>
  1015. </div>
  1016. </div>
  1017. </div>
  1018. </nav>
  1019.  
  1020. <div id="entries">
  1021. {block:Posts}
  1022. <div id="stuff">
  1023.  
  1024. {block:Quote}
  1025.  
  1026.  
  1027. <div id="titlequote">{Quote}</div>
  1028. {block:Source}<div id="source">{Source}</div>{/block:Source}
  1029. {/block:Quote}
  1030.  
  1031.  
  1032.  
  1033. {block:Text}
  1034.  
  1035. {block:Title}
  1036. <div id="title">{Title}</div>{/block:Title}
  1037. {Body}
  1038. {/block:Text}
  1039.  
  1040. {block:Link}
  1041. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  1042. {/block:Link}
  1043.  
  1044. {block:Chat}
  1045. {block:Title}
  1046. <h1>{Title}</h1>
  1047. {/block:Title}
  1048. <div class="chat">
  1049. <ol>{block:Lines}
  1050. <li class="line {Alt}">
  1051. {block:Label}
  1052. <span class="label">
  1053. {Label}</span>
  1054. {/block:Label}{Line}</li>
  1055. {/block:Lines}
  1056. </ol></div>
  1057. {/block:Chat}
  1058.  
  1059. {block:Photo}
  1060.  
  1061. {block:if500pxPosts}<img src="{PhotoURL-500}">{/block:if500pxPosts}
  1062. {block:if250pxPosts}<img src="{PhotoURL-250}">{/block:if250pxPosts}
  1063. {block:if400pxPosts}<img src="{PhotoURL-400}">{/block:if400pxPosts}
  1064. {block:permalink}{block:Caption}{Caption}{/block:Caption}
  1065. {/block:permalink}
  1066. {/block:Photo}
  1067.  
  1068. {block:Photoset}
  1069. {block:if250pxPosts}{Photoset-250}{/block:if250pxPosts}
  1070. {block:if500pxPosts}{Photoset-500}{/block:if500pxPosts}
  1071. {block:if400pxPosts}{Photoset-400}{/block:if400pxPosts}
  1072. {block:permalink}{block:Caption}{Caption}{/block:Caption}
  1073. {/block:permalink}
  1074. {/block:Photoset}
  1075.  
  1076. {block:Video}
  1077. {block:if250pxPosts}{Video-250}{/block:if250pxPosts}
  1078. {block:if500pxPosts}{Video-500}{/block:if500pxPosts}
  1079. {block:if400pxPosts}{Video-400}{/block:if400pxPosts}
  1080. {block:permalink}{block:Caption}{Caption}{/block:Caption}
  1081. {/block:permalink}
  1082. {/block:Video}
  1083.  
  1084. {block:Audio}
  1085. <div id="audios">
  1086. <div class="player">{AudioPlayerWhite}</div>
  1087. <div class="audioinfo">
  1088. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  1089. </div>
  1090. </div>
  1091. {/block:Audio}
  1092.  
  1093.  
  1094. {block:Answer}
  1095. <div class="q">
  1096. <div class="as" >{Asker} said: {Question}</div>
  1097. <div class="a">{Answer}</div>
  1098. </div>
  1099. {/block:Answer}
  1100.  
  1101.  
  1102.  
  1103. {block:Date}
  1104. <div id="info">
  1105.  
  1106. <a href="{Permalink}">
  1107. {block:Date}
  1108. {12Hour}:{Minutes} {AmPm}
  1109. {/block:Date}
  1110.  
  1111. </a> {block:NoteCount}
  1112. | ♥ <a href="{Permalink}">{NoteCount}</a>{/block:NoteCount}
  1113. <div id="inforight">
  1114. {block:RebloggedFrom}
  1115. <a href="{ReblogURL}" title="reblog"><i class="fa fa-retweet fa-lg"></i></a>
  1116. <a href="{ReblogParentURL}" title="via"><i class="fa fa-bars fa-lg"></i></a>
  1117. {/block:RebloggedFrom}
  1118. {block:ContentSource}
  1119. <a href="{SourceURL}" title="source"><i class="fa fa-picture-o fa-lg"></i></a>
  1120. {/block:ContentSource}
  1121.  
  1122.  
  1123. </div>
  1124.  
  1125. <div id="tags">
  1126. {block:HasTags}
  1127. {block:Tags}- <a href="{TagURL}">{Tag}</a> {/block:Tags}
  1128. {/block:HasTags}
  1129. </div>
  1130.  
  1131. </div></div>
  1132.  
  1133.  
  1134. {block:PostNotes}
  1135. <div class="pagenotes">{PostNotes-16}</div>{/block:PostNotes}
  1136. {/block:Posts}
  1137.  
  1138. <div id="pagi">
  1139. {block:Pagination}
  1140. {block:PreviousPage}
  1141. <a href="{PreviousPage}">back</a>
  1142. {/block:PreviousPage}
  1143. {block:NextPage}
  1144. <a href="{NextPage}">next</a>
  1145. {/block:NextPage}
  1146. </div>
  1147. {/block:Pagination}
  1148. </div>
  1149.  
  1150. </div>
  1151. </div>
  1152.  
  1153.  
  1154.  
  1155. {block:ContentSource}
  1156. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1157. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1158. {/block:SourceLogo}
  1159. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1160. {/block:ContentSource}
  1161. </body>
  1162. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement