API tools faq
paste
azurethemes

#5 rayquaza

azurethemes
Apr 2nd, 2016
267
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.83 KB | None | 0 0
raw download clone embed print report
  1. <!----
  2.  
  3.  
  4.  
  5. ☾ ● Espeon Themes ● ☽
  6. Theme No. 05 - Rayquaza
  7. This theme and coding was created by espeon themes.
  8. Any distribution without permission is violating against the copyright.
  9. This theme was published for public use, but can not be claimed as own!
  10. © Espeon themes, 2016. All rights reserved.
  11.  
  12.  
  13. --->
  14. <!-----start html---->
  15. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  16. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  17. <!-----custom google fonts---->
  18. <script type="text/javascript">
  19. WebFontConfig = {
  20. google: { families: [ 'Roboto:400,500,700:latin' , 'Roboto::latin' , 'Khand:400,600:latin' , 'Montserrat:400,700:latin' , 'Lato:300,700:latin', 'Raleway:400,700:latin' , 'Open+Sans:400,700,600:latin' , 'Exo:400,700,600:latin','Roboto+Condensed:400,700:latin', 'Jaldi:400,700:latin', 'Mallanna::latin', 'NTR::latin', 'Share+Tech::latin'] }
  21. };
  22. (function() {
  23. var wf = document.createElement('script');
  24. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  25. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  26. wf.type = 'text/javascript';
  27. wf.async = 'true';
  28. var s = document.getElementsByTagName('script')[0];
  29. s.parentNode.insertBefore(wf, s);
  30. })(); </script>
  31. <!-----tooltips---->
  32. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  33. <script>
  34. (function($){
  35. $(document).ready(function(){
  36. $("a[title]").style_my_tooltips({
  37. tip_follows_cursor:true,
  38. tip_delay_time:100,
  39. tip_fade_speed:500,
  40. attribute:"title"
  41. });
  42. });
  43. })(jQuery);
  44. </script>
  45. <!-----back to top button---->
  46. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
  47. <script>
  48. $(document).ready(function(){
  49.  
  50. // Der Button wird mit JavaScript erzeugt und vor dem Ende des body eingebunden.
  51. var back_to_top_button = ['<a href="#top" class="back-to-top">back to top</a>'].join("");
  52. $("body").append(back_to_top_button)
  53.  
  54. // Der Button wird ausgeblendet
  55. $(".back-to-top").hide();
  56.  
  57. // Funktion für das Scroll-Verhalten
  58. $(function () {
  59. $(window).scroll(function () {
  60. if ($(this).scrollTop() > 100) { // Wenn 100 Pixel gescrolled wurde
  61. $('.back-to-top').fadeIn();
  62. } else {
  63. $('.back-to-top').fadeOut();
  64. }
  65. });
  66.  
  67. $('.back-to-top').click(function () { // Klick auf den Button
  68. $('body,html').animate({
  69. scrollTop: 0
  70. }, 800);
  71. return false;
  72. });
  73. });
  74.  
  75. });
  76. </script>
  77. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
  78. <script type="text/javascript"
  79. src="http://codysherman.com/tools/infinite-scrolling/code" ></script>
  80. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  81. <head>
  82. <title>{Title}</title>
  83. <link rel="shortcut icon" href="{Favicon}">
  84. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  85. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  86. <!-----all colors---->
  87. <meta name="color:background" content="#f5f5f5"/>
  88. <meta name="color:text" content="#000000"/>
  89. <meta name="color:links" content="#000000"/>
  90. <meta name="color:info" content="#000000"/>
  91. <meta name="color:title" content="#000000"/>
  92. <meta name="color:posts" content="#ffffff">
  93. <meta name="color:scrollbar" content="#000000">
  94. <meta name="color:asks" content="#ffffff">
  95. <meta name="color:hover" content="#97c5e0">
  96. <meta name="color:accent" content="#97c5e0">
  97. <!-----images---->
  98. <meta name="image:background" content=""/>
  99. <meta name="image:header" content=""/>
  100. <!-----texts---->
  101. <meta name="text:title" content="Theme 04: umbreon "/>
  102. <!-----sidebar links---->
  103. <meta name="text:link one" content="link one">
  104. <meta name="text:link two" content="link two">
  105. <meta name="text:link one url" content="/">
  106. <meta name="text:link two url" content="/">
  107.  
  108. <!-----custom css---->
  109. <style type="text/css">
  110. /*alternate tumblr controls made by espeon themes*/
  111. #alternatetumblrcontrols{
  112. width:1340px;
  113. height:30px;
  114. top:0px;
  115. opacity:1;
  116. padding:5px;
  117. position:fixed;
  118. font-family: 'calibri' , sans-serif;
  119. letter-spacing:6px;
  120. text-align:right;
  121. overflow:hidden;
  122. padding-right:50px;
  123. background-image:url('{image:background}');
  124. background-attachment: fixed;
  125. background-repeat: repeat;
  126. font-weight:700;
  127. background:{color:background};
  128. font-style:italic;
  129. color:{color:text};
  130. text-transform:uppercase;
  131. line-height:31px;
  132. font-size:12px;
  133. left:0px;
  134. z-index:999999999999999999999999999999999;
  135. }
  136. /*scrollbar*/
  137. ::-webkit-scrollbar-thumb{
  138. height:auto;
  139. background-color:{color:scrollbar};
  140. }
  141. ::-webkit-scrollbar{
  142. height:2px;
  143. width:5px;
  144. background-color:{color:scrollbar background};
  145. }
  146. /*tooltips*/
  147. #s-m-t-tooltip{
  148. margin:15px 18px 6px 18px;
  149. padding:6px;
  150. background-color:{color:accent};
  151. font-family: 'calibri', sans-serif;
  152. border-radius:2px 2px 2px 2px;
  153. font-weight:600;
  154. font-size:10px;
  155. text-transform:uppercase;
  156. letter-spacing:0px;
  157. color:{color:text};
  158. z-index:999999999999999999999999999999999999;
  159. }
  160. /*body basics*/
  161. body{
  162. background-color:{color:background};
  163. background-image:url('{image:background}');
  164. background-attachment: fixed;
  165. background-repeat: repeat;
  166. font-weight:none;
  167. font-family: 'calibri', sans-serif;
  168. font-size:10px;
  169. text-align:justify;
  170. color:{color:text};
  171. margin:0;
  172. }
  173. a{
  174. text-decoration:none;
  175. color:{color:links};
  176. transition-duration: 0.1s;
  177. -moz-transition-duration: 0.1s;
  178. -webkit-transition-duration: 0.1s;
  179. -o-transition-duration: 0.1s;
  180. }
  181. a:hover{
  182. text-decoration:none;
  183. color:{color:accent};
  184. transition-duration: 0.1s;
  185. -moz-transition-duration: 0.1s;
  186. -webkit-transition-duration: 0.1s;
  187. -o-transition-duration: 0.1s;
  188. }
  189. img {
  190.  
  191. }
  192. blockquote {
  193. font-size:10px;
  194. width:auto;
  195. border-left:3px solid #eee;
  196. text-align:left;
  197. padding:1px;
  198. font-weight:none;
  199. margin-top:15px;
  200. margin-left:12px;
  201. padding-top:0.5px;
  202. padding-bottom:0.5px;
  203. font-size:10px;
  204. font-family: 'calibri', sans-serif;
  205. margin-right:20px;
  206. padding-left:15px;
  207. color:{color:text};
  208. }
  209. pre{
  210. font-size:9px;
  211. text-align:center;
  212. text-transform:none;
  213. font-family: 'Bitter', serif;
  214. font-weight:bold;
  215. line-height:9px;
  216. border-left:1px solid #eee;
  217. border-bottom:1px solid #eee;
  218. letter-spacing:2px;
  219. background-color:{color:posts};
  220. color:{color:text};
  221. padding:6px;
  222. }
  223. small{
  224. font-size:9px;
  225. font-family: 'roboto', sans-serif;
  226. }
  227. big{
  228. font-size:12px;
  229. font-family: 'roboto', sans-serif;
  230. font-weight:700;
  231. }
  232. sub{
  233. font-size:8px;
  234. font-family: 'calibri', sans-serif;
  235. }
  236. h1 {
  237. font-size:11px;
  238. text-align:center;
  239. font-family: 'roboto', sans-serif;
  240. letter-spacing:0px;
  241. text-transform:uppercase;
  242. font-weight:700;
  243. line-height:17px;
  244. border-bottom:1px solid #eee;
  245. color:{color:text};
  246. padding:7px;
  247. }
  248. h1 a{
  249. color:{color:text};
  250. }
  251. h2{
  252. color:{color:text};
  253. text-transform:uppercase;
  254. font-family: 'Roboto', sans-serif;
  255. text-align:left;
  256. }
  257. b {
  258. font-weight:bold;
  259. padding:2px;
  260. font-family: 'Roboto', sans-serif;
  261. color:{color:text};
  262. }
  263. i {
  264. font-weight:italic;
  265. color:{color:text};
  266. }
  267. grouptitle {
  268. color:{color:text};
  269. text-transform:none;
  270. font-size:10px;
  271. font-family: 'calibri', sans-serif;
  272. }
  273. tit {
  274. color:{color:text};
  275. font-size:14px;
  276. text-transform:lowercase;
  277. font-family: 'roboto', sans-serif;
  278. letter-spacing:1px;
  279. font-weight:600;
  280. }
  281. am {
  282. color:{color:text};
  283. font-size:22px;
  284. padding:8px;
  285. padding-top:2px;
  286. text-transform:uppercase;
  287. font-family: 'roboto', sans-serif;
  288. letter-spacing:0px;
  289. font-weight:500;
  290. }
  291. n {
  292. font-weight:bold;
  293. letter-spacing:-1px;
  294. text-shadow: 1px 1px 1px #cccccc;
  295. font-size:12px;
  296. text-transform:uppercase;
  297. color:{color:text};
  298. }
  299. u {
  300. text-decoration:none;
  301. color:color:;{text};
  302. border-bottom:1px solid {color:text};
  303. }
  304. underline {
  305. text-decoration:none;
  306. color:color:;{text};
  307. border-bottom:1px solid {color:text};
  308. }
  309. /*icon image*/
  310. #header {
  311. position:fixed;
  312. margin-top:190px;
  313. padding:10px;
  314. margin-left:180px;
  315. background-color:transparent;
  316. z-index:9999999999999999;
  317. }
  318. #headerimage {
  319. z-index:-99999;
  320. }
  321. #headerimage img {
  322. width:730px;
  323. height:400px;
  324. left:330px;
  325. top:50px;
  326. position:absolute;
  327. background:{color:posts};
  328. opacity:1;
  329. z-index:9999999;
  330. }
  331. /*sidebar description*/
  332. #description {
  333. overflow:hidden;
  334. position:fixed;
  335. text-align:left;
  336. top:270px;
  337. left:280px;
  338. word-wrap: break-word;
  339. font-family: 'Roboto Condensed', sans-serif;
  340. width:130px;
  341. height:40px;
  342. padding-top:6px;
  343. opacity:1;
  344. line-height:14px;
  345. font-weight:none;
  346. color:{color:text};
  347. letter-spacing:0px;
  348. font-size:11px;
  349. z-index:999999;
  350. }
  351. /*back to top button*/
  352. .back-to-top {
  353. position: fixed;
  354. color:{color:text};
  355. bottom:13px;
  356. text-transform:uppercase;
  357. background:{color:background};
  358. left:13px;
  359. font-family: 'calibri', sans-serif;
  360. font-size:8px;
  361. z-index:9999999999;
  362. font-weight:700;
  363. padding:10px;
  364. }
  365. /*jump pagination*/
  366. .pagination{
  367. font-family: 'roboto', sans-serif;
  368. margin-left:-190px;
  369. width:auto;
  370. padding-top:-10px;
  371. letter-spacing:2px;
  372. padding-bottom:20px;
  373. font-size:13px;
  374. text-align:center;
  375. }
  376. .pagination a{
  377. padding:5px;
  378. font-family: 'roboto', sans-serif;
  379. font-weight:600;
  380. bottom:10px;
  381. margin-left:5px;
  382. color:{color:text};
  383. }
  384. .pagination a:hover{
  385. color:{color:hover};
  386. -moz-transition-duration:0.5s;
  387. -webkit-transition-duration:0.5s;
  388. -o-transition-duration:0.5s;
  389. transition: all 0.3s ease-out;
  390. }
  391. /*post notes*/
  392. ol.notes {
  393. padding: 0px;
  394. margin: 25px 0px;
  395. font-family:'Roboto',sans-serif;
  396. list-style-type: none;
  397. margin-top:-31px;
  398. background:{color:posts};
  399. margin-left:16px;
  400. width:560px;
  401. border-bottom: solid 1px #eee;
  402. }
  403. ol.notes li.note {
  404. border-top: solid 1px #eee;
  405. padding: 10px;
  406. }
  407. ol.notes li.note img.avatar {
  408. vertical-align: -2px;
  409. border-radius:100px;
  410. margin-right: 0px;
  411. width: 16px;
  412. height: 16px;
  413. }
  414. ol.notes li.note span.action {
  415. font-weight: 300;
  416. }
  417. ol.notes li.note .answer_content {
  418. font-weight: normal;
  419. }
  420. ol.notes li.note blockquote {
  421. border-color: #eee;
  422. padding: 4px 10px;
  423. margin: 10px 0px 0px 25px;
  424. }
  425. ol.notes li.note blockquote a {
  426. text-decoration: none;
  427. }
  428. /*audio*/
  429. .audioartist {
  430. font-family:'roboto', sans-serif;
  431. font-size:10px;
  432. text-transform:lowercase;
  433. font-weight:600;
  434. }
  435. .audiotitle {
  436. font-family:'roboto', sans-serif;
  437. font-size:10px;
  438. text-transform:lowercase;
  439. font-weight:600;
  440. }
  441. .audioplayed {
  442. font-family:'roboto', sans-serif;
  443. font-size:10px;
  444. text-transform:lowercase;
  445. font-weight:600;
  446. }
  447. .audioplayr {
  448. width:400px;
  449. color:{color:text};
  450. background:{color:accent};
  451. }
  452. audioinfo {
  453. font-family:'roboto', sans-serif;
  454. font-size:10px;
  455. letter-spacing:2px;
  456. text-transform:lowercase;
  457. font-weight:300;
  458. }
  459. /*post styles*/
  460. .pcaption{
  461. font-family:'calibri', sans-serif;
  462. font-size:10px;
  463. margin-left:22px;
  464. letter-spacing:0px;
  465. text-transform:none;
  466. font-weight:300;
  467. }
  468. .psets{
  469. max-width:400px;
  470. margin-top:-13px;
  471. height:auto;
  472. }
  473. .vsets{
  474. max-width:400px;
  475. margin-top:-13px;
  476. height:auto;
  477. }
  478. /*posts*/
  479. #entries {
  480. margin-left:525px;
  481. margin-top:395px;
  482. overflow:hidden;
  483. }
  484. #post {
  485. font-size:10px;
  486. width:400px;
  487. color:{color:post text};
  488. padding:20px;
  489. padding-top:20px;
  490. border:1px solid #eee;
  491. background-color:{color:posts};
  492. text-align:justify;
  493. padding-bottom:0px;
  494. margin:70px;
  495. overflow:hidden;
  496. }
  497. #post img{
  498. max-width:400px;
  499. margin-top:-12px;
  500. height:auto;
  501. }
  502. /*questions and answers*/
  503. #asking {
  504. margin-left:30px;
  505. padding:15px;
  506. margin-top:-26px;
  507. }
  508. #askingimage {
  509. }
  510. #askingimage img {
  511. margin-left:13px;
  512. width:25px;
  513. height:25px;
  514. margin-top:13px;
  515. }
  516. #question {
  517. padding:25.5px;
  518. padding-left:28px;
  519. margin-top:-34px;
  520. margin-left:76px;
  521. font-size:10px;
  522. width:260px;
  523. font-family: 'calibri', sans-serif;
  524. color:{color:text};
  525. background:{color:asks};
  526. }
  527. #asker{
  528. margin-top:10px;
  529. padding:1px;
  530. font-weight:600;
  531. font-size:10px;
  532. padding:7px;
  533. line-height:14px;
  534. height:50px;
  535. width:50px;
  536. background:{color:accent};
  537. z-index:9999999999;
  538. color:{color:text};
  539. opacity:1;
  540. margin-left:12px;
  541. letter-spacing:1px;
  542. font-family: 'calibri', sans-serif;
  543. text-transform:uppercase;
  544. }
  545. #askerurl{
  546. margin-top:-57px;
  547. padding:1px;
  548. font-weight:500;
  549. font-size:10px;
  550. padding:7px;
  551. line-height:14px;
  552. height:13px;
  553. width:465px;
  554. z-index:9999999999;
  555. color:{color:text};
  556. opacity:1;
  557. margin-left:97px;
  558. padding-bottom:7px;
  559. letter-spacing:0px;
  560. font-family: 'calibri', sans-serif;
  561. text-transform:uppercase;
  562. }
  563. /*post info*/
  564. #info {
  565. width:auto;
  566. height:42px;
  567. text-align:left;
  568. font-family: 'roboto', sans-serif;
  569. text-transform:lowercase;
  570. margin-left:00px;
  571. font-size:9px;
  572. padding-left:1px;
  573. margin-top:10px;
  574. opacity:1;
  575. overflow:hidden;
  576. font-weight:700;
  577. font-style:none;
  578. line-height:35px;
  579. border-top:1px solid #eee;
  580. letter-spacing:1px;
  581. z-index:9999999999999999;
  582. color:{color:info};
  583. }
  584. #info a {
  585. text-align:center;
  586. font-weight:700;
  587. padding:5px;
  588. letter-spacing:1px;
  589. font-family: 'roboto', sans-serif;
  590. line-height:5px;
  591. color:{color:info};
  592. }
  593. #info a:hover{
  594. color:{color:posts};
  595. }
  596. /*post tags*/
  597. #tags {
  598. text-align:left;
  599. opacity:1;
  600. font-size:9px;
  601. font-family: 'roboto', sans-serif;
  602. margin-top:-14px;
  603. margin-left:-8px;
  604. color:{color:info};
  605. padding:5px;
  606. font-weight:400;
  607. padding-bottom:10px;
  608. width:auto;
  609. text-transform:lowercase;
  610. -webkit-transition: all 0.7s ease-in-out;
  611. -moz-transition: all 0.7s ease-in-out;
  612. -o-transition: all 0.7s ease-in-out;
  613. -ms-transition: all 0.7s ease-in-out;
  614. transition: all 0.7s ease-in-out;
  615. }
  616. #tags a {
  617. padding:8px;
  618. margin-top:-3px;
  619. color:{color:info};
  620. line-height:2px;
  621. letter-spacing:1px;
  622. font-weight:700;
  623. width:auto;
  624. text-align:left;
  625. font-size:9px;
  626. font-family: 'roboto', sans-serif;
  627. display:inline-block;
  628. }
  629. #tags a:hover {
  630. -moz-transition-duration:0.3s;
  631. -webkit-transition-duration:0.3s;
  632. -o-transition-duration:0.3s;
  633. color:{color:hover};
  634. }
  635. /*credit (u better leave this here u goof)*/
  636. #credit{
  637. position:fixed;
  638. font-size:8px;
  639. font-weight:700;
  640. padding-bottom:5px;
  641. padding-top:5px;
  642. height:20px;
  643. width:auto;
  644. opacity:1;
  645. padding-left:5px;
  646. padding-right:5px;
  647. background:transparent;
  648. right:13px;
  649. bottom:13px;
  650. letter-spacing:0px;
  651. line-height:22px;
  652. padding:3px;
  653. text-align:center;
  654. float:left;
  655. font-family: 'calibri', sans-serif;
  656. color:{color:text};
  657. text-transform:uppercase;
  658. }
  659. #credit:hover{
  660. background:{color:posts};
  661. }
  662. /*sidebar links*/
  663. .links {
  664. width:730px;
  665. height:30px;
  666. overflow:hidden;
  667. cursor:pointer;
  668. top:10px;
  669. opacity:1;
  670. z-index:999999999999999999999;
  671. border-bottom:1px solid #eee;
  672. background:{color:posts};
  673. position:fixed;
  674. left:330px;
  675. text-align:left;
  676. }
  677. .links #all {
  678. margin-left:3px;
  679. margin-top:4px;
  680. padding:5px;
  681. height:28px;
  682. transition-duration: 0.3s;
  683. -moz-transition-duration: 0.3s;
  684. -webkit-transition-duration: 0.3s;
  685. -o-transition-duration: 0.3s;
  686. }
  687. .links #all a:hover {
  688. color:{color:hover};
  689. transition-duration: 0.3s;
  690. -moz-transition-duration: 0.3s;
  691. -webkit-transition-duration: 0.3s;
  692. -o-transition-duration: 0.3s;
  693. }
  694. .links a {
  695. width:auto;
  696. height:10px;
  697. margin-bottom:8px;
  698. text-align:left;
  699. text-transform:none;
  700. padding:5px;
  701. opacity:1;
  702. margin-left:14px;
  703. line-height:9px;
  704. color:{color:links};
  705. font-weight:700;
  706. font-family: 'Roboto', sans-serif;
  707. letter-spacing:0px;
  708. font-size:10px;
  709. display:inline-block;
  710. -webkit-transition: all 0.3s ease-in-out;
  711. -moz-transition: all 0.3s ease-in-out;
  712. -o-transition: all 0.3s ease-in-out;
  713. -ms-transition: all 0.3s ease-in-out;
  714. transition: all 0.3s ease-in-out;
  715. }
  716. /*links*/
  717. .toppp {
  718. top:443px;
  719. position:absolute;
  720. left:330px;
  721. z-index:-9999999999999999;
  722. background:{color:posts};
  723. border:1px solid #eee;
  724. width:729px;
  725. }
  726. .sticky{
  727. position:fixed;
  728. width:729px;
  729. top:0px;
  730. left:330px;
  731.  
  732. z-index:-99999999999999;
  733. }
  734. .sticky #navi{
  735. width:729px;
  736. text-align:left;
  737. color:{color:text};
  738. -webkit-transition: all 0.3s ease-in-out;
  739. -moz-transition: all 0.3s ease-in-out;
  740. -o-transition: all 0.3s ease-in-out;
  741. -ms-transition: all 0.3s ease-in-out;
  742. transition: all 0.3s ease-in-out;
  743. }
  744. #navi{
  745. margin:auto;
  746. font-size:10px;
  747. height:3000px;
  748. letter-spacing:1px;
  749. font-weight:600;
  750. color:{color:text};
  751. padding-left:5px;
  752. width:729px;
  753. font-style:lowercase;
  754. text-align:left;
  755. -webkit-transition: all 0.5s ease-in-out;
  756. -moz-transition: all 0.5s ease-in-out;
  757. -o-transition: all 0.5s ease-in-out;
  758. -ms-transition: all 0.5s ease-in-out;
  759. transition: all 0.5s ease-in-out;
  760. }
  761. #navi a{
  762. display:inline-block;
  763. color:{color:text};
  764. padding:18px 0px 8px 0px;
  765. margin:0px 5px 0px 13px;
  766. font-weight:500;
  767. margin-top:2px;
  768. line-height:7px;
  769. font-style:none;
  770. font-family: 'roboto', sans-serif;
  771. text-transform:lowercase;
  772. -webkit-transition: all 0.3s ease-in-out;
  773. -moz-transition: all 0.3s ease-in-out;
  774. -o-transition: all 0.3s ease-in-out;
  775. -ms-transition: all 0.3s ease-in-out;
  776. transition: all 0.3s ease-in-out;
  777. }
  778. #navi a:hover{
  779. color:{color:hover};
  780. -webkit-transition: all 0.3s ease-in-out;
  781. -moz-transition: all 0.3s ease-in-out;
  782. -o-transition: all 0.3s ease-in-out;
  783. -ms-transition: all 0.3s ease-in-out;
  784. transition: all 0.3s ease-in-out;
  785. }
  786. /*titles*/
  787. #sidebartitle{
  788. width:auto;
  789. height:20px;
  790. top:10px;
  791. border-bottom:1px solid #ddd;
  792. opacity:0;
  793. padding:5px;
  794. position:fixed;
  795. font-family: 'roboto' , sans-serif;
  796. letter-spacing:1px;
  797. text-align:left;
  798. overflow:hidden;
  799. font-weight:500;
  800. color:{color:text};
  801. text-transform:lowercase;
  802. line-height:31px;
  803. font-size:14px;
  804. left:330px;
  805. z-index:9999999;
  806. }
  807. /*sidebar*/
  808. #boxes {
  809. overflow:auto;
  810. position:absolute;
  811. text-align:left;
  812. margin-top:45px;
  813. margin-left:215px;
  814. text-transform:none;
  815. font-style:normal;
  816. font-family: 'Roboto', sans-serif;
  817. width:255px;
  818. height:100px;
  819. opacity:1;
  820. line-height:10px;
  821. font-weight:none;
  822. color:{color:text};
  823. background:{color:description};
  824. padding:17px;
  825. letter-spacing:0px;
  826. font-size:10px;
  827. transition-duration: 0.9s;
  828. -moz-transition-duration:0.9s;
  829. -webkit-transition-duration:0.9s;
  830. -o-transition-duration:0.9s;
  831. }
  832. .tit {
  833. font-size:14px;
  834. text-transform:lowercase;
  835. margin-bottom:15px;
  836. letter-spacing:1px;
  837. font-weight:500;
  838. width:211px;
  839. margin-left:-21px;
  840. margin-top:-21px;
  841. border-bottom:1px solid #eee;
  842. border-top:1px solid #eee;
  843. text-align:left;
  844. font-family: 'roboto', sans-serif;
  845. color:{color:text};
  846. padding:10px;
  847. }
  848. .sidebox {
  849. position:absolute;
  850. background:{color:posts};
  851. width:230px;
  852. top:482px;
  853. border:1px solid #eee;
  854. left:352px;
  855. z-index:999999999;
  856. }
  857. .box {
  858. padding:20px;
  859. }
  860. #description {
  861. margin:5px;
  862. text-align:justify;
  863. }
  864. .members {
  865. margin:5px;
  866. font-size:10px;
  867. text-transform:uppercase;
  868. text-align:justify;
  869. }
  870. #description1 {
  871. margin:5px;
  872. font-size:10px;
  873. padding-top:8px;
  874. font-weight:500;
  875. padding:15px;
  876. line-height:14px;
  877. font-family: 'roboto', sans-serif;
  878. }
  879. #sidebarr {
  880. margin:5px;
  881. text-align:justify;
  882. }
  883. #dates {
  884. z-index:9999999999;
  885. padding:22px;
  886. text-align:left;
  887. font-size:10px;
  888. font-weight:400;
  889. line-height:52px;
  890. font-family: 'roboto', sans-serif;
  891. margin-left:-15px;
  892. margin-top:0px;
  893. width:282px;
  894. }
  895. #dates date {
  896. font-size:9px;
  897. text-align:center;
  898. width:auto;
  899. height:5px;
  900. font-weight:none;
  901. font-weight:500;
  902. border:1px solid #eee;
  903. border-top:1px solid {color:accent};
  904. font-family: 'roboto', sans-serif;
  905. letter-spacing:2px;
  906. color:{color:text};
  907. padding:13px;
  908. }
  909. #dates dateu {
  910. font-size:9px;
  911. text-align:center;
  912. width:auto;
  913. height:4px;
  914. font-weight:500;
  915. text-transform:none;
  916. border-bottom:1px solid #eee;
  917. font-family: 'roboto', sans-serif;
  918. letter-spacing:0px;
  919. color:{color:text};
  920. padding:13px;
  921. }
  922. .aboutt {
  923. margin:5px;
  924. font-size:10px;
  925. padding-top:8px;
  926. font-weight:500;
  927. padding:15px;
  928. line-height:14px;
  929. font-family: 'roboto', sans-serif;
  930. }
  931. #projects {
  932. text-align:left;
  933. margin:5px;
  934. margin-top:30px;
  935. font-size:10px;
  936. letter-spacing:0px;
  937. }
  938. #projects img {
  939. border:1px solid #eee;
  940. width:70px;
  941. height:70px;
  942. border-radius:5px 5px 5px 5px;
  943. float:left;
  944. margin-right:10px;
  945. }
  946. {CustomCSS}</style>
  947. </head>
  948. <body>
  949. <!-----alternate tumblr controls made by espeon themes---->
  950. <div id="alternatetumblrcontrols">
  951. <a href="https://www.tumblr.com/customize/{Name}?redirect_to=/settings/blog/{Name}"title="Edit theme"><i class="fa fa-cog"style="color:{color:text};font-size:16px"></i></a>
  952. <a href="http://tumblr.com/follow/{Name}"title="Follow {Name}"><i class="fa fa-user-plus"style="color:{color:text};font-size:16px"></i></a>
  953. <a href="https://www.tumblr.com/dashboard?conversation={Name}"title="Start chatting"><i class="fa fa-comments"style="color:{color:text};font-size:16px"></i></a>
  954. <a href="http://tumblr.com/dashboard"title="dashboard"><i class="fa fa-home"style="color:{color:text};font-size:16px"></i></a>
  955. </a></div>
  956. <!-----basics---->
  957. <div id="sidebar">
  958. <div id="headerimage"><img src="{image:header}"></a></div>
  959. <div id="tumblrcontrols">
  960. <a href="https://www.tumblr.com/customize/{Name}?redirect_to=/settings/blog/{Name}"title="Edit theme"><i class="fa fa-cog"style="color:{color:text};font-size:16px"></i></a>
  961. <a href="http://tumblr.com/follow/{Name}"title="Follow {Name}"><i class="fa fa-user-plus"style="color:{color:text};font-size:16px"></i></a>
  962. <a href="https://www.tumblr.com/dashboard?conversation={Name}"title="Start chatting"><i class="fa fa-comments"style="color:{color:text};font-size:16px"></i></a>
  963. <a href="http://tumblr.com/dashboard"title="dashboard"><i class="fa fa-home"style="color:{color:text};font-size:16px"></i></a>
  964. </a></div>
  965. </div>
  966. </div>
  967. <!-----top bar links---->
  968. <div class="links">
  969. <div id="all">
  970. <tit>{text:title}</tit>
  971. <a href="/">index</a>
  972. <a href="/ask">contact</a>
  973. <a href="{text:link one url}">{text:link one}</a>
  974. <a href="{text:link two url}">{text:link two}</a>
  975. </div>
  976. </div>
  977. <!-----top bar links---->
  978. <div class="toppp">
  979. <div id="navi">
  980. </div>
  981. </div>
  982. <!---- Sticky Position (Bar) with CSS or jQuery by http://www.hongkiat.com/ --->
  983.  
  984. <script>
  985. var header = document.querySelector('.toppp');
  986. var origOffsetY = header.offsetTop;
  987.  
  988. function onScroll(e) {
  989. window.scrollY >= origOffsetY ? header.classList.add('sticky') :
  990. header.classList.remove('sticky');
  991. }
  992.  
  993. document.addEventListener('scroll', onScroll);
  994. </script>
  995. <!-----sidebar---->
  996. <div class="sidebox">
  997. <!-----description---->
  998. <div class="box">
  999. <div class="tit"style=" z-index:999999999;"><i class="fa fa-home"style="font-size:15px;color:{color:text}"></i> Home</div>
  1000. <div id="description1">{description}</div>
  1001. </div>
  1002. <!-----updates---->
  1003. <div class="box">
  1004. <div class="tit"><i class="fa fa-rss feed"style="font-size:15px;color:{color:text}"></i> Updates</div>
  1005. <div class="aboutt">
  1006. <b>FEBRUARY 2016:</b> moonstarthemes was changed to espeon themes!
  1007. </br>
  1008.  
  1009. </a>
  1010. </div></div>
  1011. <!-----projects or albums---->
  1012. <div class="box">
  1013. <div class="tit"><i class="fa fa-user"style="font-size:15px;color:{color:text}"></i> About</div>
  1014. <div id="projects"><img src="https://40.media.tumblr.com/2a5a218bd4a8e3f7355b2b1d32ec2428/tumblr_o2leavcocI1ujppofo1_250.jpg">
  1015. <ul>
  1016. <b>ESPEON THEMES</b><br>
  1017. Espeon themes was originally founded as moonstarthemes in late 2015 by Azure.<br>
  1018. She's been creating themes since summer 2014, started as azureofrp.
  1019. </br>
  1020. In Februrary 2016, moonstarthemes was changed to Espeon themes!
  1021. </div>
  1022. </div>
  1023. <!-----blog members---->
  1024. <div class="box">
  1025. <div class="tit"><i class="fa fa-users"style="font-size:15px;color:{color:text}"></i> members</div>
  1026. <div class="members">
  1027. {block:GroupMembers}
  1028. <table style="margin-top:0px;">
  1029. {block:GroupMember}
  1030. <tr>
  1031. <td style="width:40px;">
  1032. <img src="{GroupMemberPortraitURL-128}" width="40px;" height="auto;" style="margin-right: 10px;border:solid 1px #ddd;border-radius:5px"> </td>
  1033. <td style="height:auto;">
  1034. <a href="{GroupMemberURL}" title="{GroupMemberTitle}"style="font-family: 'arial', sans-serif;margin-top:0px;font-weight:bold;text-transform:uppercase;font-size:8px;letter-spacing:0px;text-decoration:underline">{GroupMemberName}</a><br><grouptitle>{GroupMemberTitle}</grouptitle></div>
  1035. </tr>
  1036. {/block:GroupMember}
  1037. </table>
  1038. {/block:GroupMembers}
  1039. </div></div>
  1040. <!-----disclaimer---->
  1041. <div class="box">
  1042. <div class="tit"><i class="fa fa-exclamation"style="font-size:15px;color:{color:text}"></i> disclaimer</div>
  1043. <div class="aboutt">All Espeon themes were created by me, Azure. - Unless stated otherwise. If another coding element was used in one of my themes, it'll be stated and credited. (Most coding elements are taken from codepen.io!
  1044. </br>
  1045. All reblogged themes were made by other amazing theme creators!
  1046. </a>
  1047. </div></div>
  1048. <!-----blog info---->
  1049. <div class="box">
  1050. <div class="tit"><i class="fa fa-info"style="font-size:15px;color:{color:text}"></i> Blog info</div>
  1051. <div class="aboutt">
  1052. <b>Blog created by:</b> Azure
  1053. </br>
  1054. <b>Blog established:</b> Late 2015
  1055. </br>
  1056. <b>Graphics by:</b> Azure
  1057. </br>
  1058. <b>Theme made by:</b> Azure (Espeon Themes)
  1059. </div>
  1060. </div>
  1061. </div>
  1062. </div>
  1063. <!-----posts and entries---->
  1064. <div id="entries">
  1065. {block:Posts}
  1066. <div id="post"
  1067. <div id="post">
  1068. <!----texts---->
  1069. {block:Text}
  1070. {block:Title}<h1><center>{Title}</center></h1>{/block:Title}
  1071. <center>{Body}</center>
  1072. {/block:Text}
  1073. <!-----question and answers---->
  1074. {block:Answer}
  1075. <div id="asker"><div id="askingimage"><img src="{AskerPortraitURL-128}"/></div></div>
  1076. <div id="askerurl">{Asker} asked:</div>
  1077. <div id="question">{Question}</div>
  1078. {Answer}{/block:Answer}
  1079. <!-----quotes---->
  1080. {block:Quote}
  1081. {block:Quote}
  1082. <h2>{Quote}</h2>
  1083. <div align="right">
  1084. {block:Source}<h1>-{Source}</h1>{/block:Source}
  1085. </div>
  1086. {/block:Quote}
  1087. <!-----links---->
  1088. {block:Link}
  1089. <h2><center><a href="{URL}">{Name}</center></a></h2>
  1090. {block:Description}{Description}{/block:Description}
  1091. {/block:Link}
  1092. <!-----chats---->
  1093. {block:Chat}
  1094. {block:Title}<h2>{Title}</h2>{/block:Title}
  1095. <ul class="convo">{block:Lines}<li class="line">{block:Label}<span class ="label">{Label}</span>{/block:Label}
  1096. {Line}</li>{/block:Lines}</ul>
  1097. {/block:Chat}
  1098. <!-----photos---->
  1099. {block:Photo}
  1100. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}" width="auto">{LinkCloseTag}
  1101. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  1102. {/block:Photo}
  1103. <!-----photosets---->
  1104. {block:Photoset}
  1105. <div class="psets">{Photoset-400}</div>
  1106. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  1107. {/block:Photoset}
  1108. <!-----videos---->
  1109. {block:Video}
  1110. <div class="vsets">{Video-400}</div>
  1111. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  1112. {/block:Video}
  1113. <!-----audios---->
  1114. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px" />{/block:AlbumArt}
  1115. {block:TrackName}<div class="audiotitle">Title: <audioinfo>{TrackName}</audioinfo><br/></div>{/block:TrackName}
  1116. {block:Artist}<div class="audioartist">Artist: <audioinfo>{Artist}</audioinfo><br/></div>{/block:Artist}
  1117. {/block:ExternalAudio}<div class="audioplayed">Played: <audioinfo>{PlayCount} times</audioinfo> </div>
  1118. </br>
  1119. <div class="audioplayr"style="background:{color:accent}">{AudioPlayer}</div>
  1120. {/block:Audio}
  1121. <!-----info---->
  1122. <div id="borderbottom"></div>
  1123. <div id="info">
  1124. <div id="permalink">
  1125. <top><a href="{Permalink}"title="{DayOfMonth} {ShortMonth} {ShortYear}">
  1126. {TimeAgo}</top></a><top>with {NoteCountWithLabel}</top>
  1127. <font style="float:right;">
  1128. {block:RebloggedFrom}
  1129. <a href="{ReblogURL}" title="reblog"target="_blank" class="details"><i class="fa fa-repeat"style="color:{color:text}"></i></a>
  1130. {block:RebloggedFrom}
  1131. {/block:RebloggedFrom}
  1132. {block:ContentSource}
  1133. <a href="{ReblogParentURL}" title="{ReblogParentName}"><i class="fa fa-history"style="color:{color:text}"></i></a> <a href="{SourceURL}"title="Source"><i class="fa fa-copyright"style="color:{color:text}"></i></a>
  1134. {/block:ContentSource}
  1135. {/block:RebloggedFrom}
  1136. </font style>
  1137. </a></div></div>
  1138. {/block:Date}
  1139. {block:HasTags}<div id="tags"> {block:Tags} <a href="{TagURL}"> #{Tag} </a> {/block:Tags}
  1140. </div>
  1141. {/block:HasTags}
  1142. </div>
  1143. {block:PostNotes} {PostNotes} {/block:PostNotes}
  1144.  
  1145. {/block:Posts}
  1146. {block:Pagination}
  1147. <div class="pagination"style="{color:title text}">
  1148. {block:PreviousPage}<a href="{PreviousPage}"title="previous page">BACK</a>{/block:PreviousPage}{block:JumpPagination length="4"}{block:CurrentPage}<span class="current_page"style="color:{color:accent};font-weight:600;padding:5px">{PageNumber}</span>{/block:CurrentPage}{block:JumpPage}<a class="jump_page"style="{color:text}" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}{block:NextPage}<a href="{NextPage}"title="next page">NEXT</a>{/block:NextPage}
  1149. {/block:Pagination}</div>
  1150. </div>
  1151. <!-----credit (u better dont touch this here u goof)---->
  1152. <div id="credit">
  1153. <a href="http://adf.ly/1WydlU"title="espeon themes"style="color:{color:text}">© Espeon</a>
  1154. </div>
  1155. </html>
  1156. </body>
  1157. <!-----end html---->
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!