azurethemes

08:old theme 49 revamped

Jun 8th, 2016
972
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.24 KB | None | 0 0
  1. <!----
  2.  
  3. ---- @ DADDYTHEMES ----
  4. theme #08
  5. old Theme 49 gasoline
  6. revamped.
  7. published for
  8. public.
  9. keep the credit.
  10. dont steal.
  11. dont claim as own.
  12. dont be an asshole.
  13. (=゚ω゚)ノ
  14.  
  15. --->
  16. <!-----start html---->
  17. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  18. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  19. <!-----custom google fonts---->
  20. <script type="text/javascript">
  21. WebFontConfig = {
  22. google: { families: [ 'Roboto:400,500,700:latin' , 'Montserrat:400,700:latin' , 'Lato:300,700:latin', 'Raleway:400,700:latin' , 'Bitter:400,400italic,700:latin' , 'Roboto+Condensed:400,400italic,700,700italic:latin', 'Josefin+Sans:400,400italic,600,700,600italic,700italic:latin', 'Work+Sans:400,500,600,700:latin' ] }
  23. };
  24. (function() {
  25. var wf = document.createElement('script');
  26. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  27. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  28. wf.type = 'text/javascript';
  29. wf.async = 'true';
  30. var s = document.getElementsByTagName('script')[0];
  31. s.parentNode.insertBefore(wf, s);
  32. })(); </script>
  33. <!-----tooltips---->
  34. <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>
  35. <script>
  36. (function($){
  37. $(document).ready(function(){
  38. $("a[title]").style_my_tooltips({
  39. tip_follows_cursor:true,
  40. tip_delay_time:10,
  41. tip_fade_speed:400,
  42. attribute:"title"
  43. });
  44. });
  45. })(jQuery);
  46. </script>
  47. <!-----back to top button---->
  48. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
  49. <script>
  50. $(document).ready(function(){
  51.  
  52. // Der Button wird mit JavaScript erzeugt und vor dem Ende des body eingebunden.
  53. var back_to_top_button = ['<a href="#top" class="back-to-top"><i class="fa fa-arrow-up"></i></a>'].join("");
  54. $("body").append(back_to_top_button)
  55.  
  56. // Der Button wird ausgeblendet
  57. $(".back-to-top").hide();
  58.  
  59. // Funktion für das Scroll-Verhalten
  60. $(function () {
  61. $(window).scroll(function () {
  62. if ($(this).scrollTop() > 100) { // Wenn 100 Pixel gescrolled wurde
  63. $('.back-to-top').fadeIn();
  64. } else {
  65. $('.back-to-top').fadeOut();
  66. }
  67. });
  68.  
  69. $('.back-to-top').click(function () { // Klick auf den Button
  70. $('body,html').animate({
  71. scrollTop: 0
  72. }, 800);
  73. return false;
  74. });
  75. });
  76.  
  77. });
  78. </script>
  79. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></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. <!--toggles-->
  87. <meta name="if:ShowTags" content="1"/>
  88. <!--all colors-->
  89. <meta name="color:background" content="#f6f6f6"/>
  90. <meta name="color:text" content="#888888"/>
  91. <meta name="color:links" content="#888888"/>
  92. <meta name="color:top links" content="#ffffff"/>
  93. <meta name="color:border" content="#888888"/>
  94. <meta name="color:posts" content="#ffffff">
  95. <meta name="color:scrollbar" content="#eeeeee">
  96. <meta name="color:asks" content="#eeeeee">
  97. <meta name="color:title" content="#eeeeee">
  98. <meta name="color:hover" content="#cccccc">
  99. <meta name="color:accent" content="#eeeeee">
  100. <meta name="color:post background" content="#eeeeee">
  101. <!--images-->
  102. <meta name="image:background" content=""/>
  103. <meta name="image:header" content=""/>
  104. <!--texts-->
  105. <meta name="text:title" content="Color me blue"/>
  106. <!--sidebar links-->
  107. <meta name="text:link one" content="link one">
  108. <meta name="text:link two" content="link two">
  109. <meta name="text:link three" content="link three">
  110. <meta name="text:link four" content="link four">
  111. <meta name="text:link one url" content="/">
  112. <meta name="text:link two url" content="/">
  113. <meta name="text:link three url" content="/">
  114. <meta name="text:link four url" content="/">
  115. <!--custom css-->
  116. <style type="text/css">
  117. /*tumblr controls*/
  118. .tmblr-iframe {
  119. top:0px!important;
  120. position:fixed!important;
  121. opacity:0.5;
  122. width: calc(40% - 30px);
  123. z-index:99999999999999!important;
  124. white-space:nowrap;
  125. transition-duration: 0.3s;
  126. -moz-transition-duration: 0.3s;
  127. -webkit-transition-duration: 0.3s;
  128. -o-transition-duration: 0.3s;
  129. }
  130. /*scrollbar*/
  131. ::-webkit-scrollbar-thumb{
  132. height:auto;
  133. border:2px solid {color:posts};
  134. background-color:{color:scrollbar};
  135. }
  136. ::-webkit-scrollbar{
  137. height:2px;
  138. border:2px solid {color:posts};
  139. width:5px;
  140. }
  141. /*tooltips*/
  142. #s-m-t-tooltip{
  143. margin:13px 18px 6px 18px;
  144. padding:6px;
  145. background-color:{color:posts};
  146. font-family: 'montserrat', serif;
  147. border:1px solid {color:accent};
  148. font-weight:500;
  149. font-size:9px;
  150. text-transform:uppercase;
  151. letter-spacing:0px;
  152. color:{color:text};
  153. z-index:999999999999999999999999999999999999;
  154. transition:0.3s ease-in-out;
  155. -webkit-transition:0.3s ease-in-out;
  156. -moz-transition:0.3s ease-in-out;
  157. -ms-transition:0.3s ease-in-out;
  158. -o-transition:0.3s ease-in-out;
  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', serif;
  168. font-size:11px;
  169. text-align:justify;
  170. color:{color:text};
  171. margin:0;
  172. }
  173. a{
  174. text-decoration:none;
  175. color:{color:links};
  176. -moz-transition-duration:0.5s;
  177. -webkit-transition-duration:0.5s;
  178. -o-transition-duration:0.5s;
  179. transition: all 0.3s ease-out;
  180. }
  181. a:hover{
  182. text-decoration:none;
  183. color:{color:hover};
  184. -moz-transition-duration:0.5s;
  185. -webkit-transition-duration:0.5s;
  186. -o-transition-duration:0.5s;
  187. transition: all 0.3s ease-out;
  188. }
  189. img {
  190. }
  191. blockquote {
  192. font-size:10px;
  193. width:auto;
  194. border-left:3px solid #eee;
  195. text-align:left;
  196. padding:1px;
  197. font-weight:none;
  198. margin-top:15px;
  199. margin-left:21px;
  200. padding-top:0.5px;
  201. padding-bottom:0.5px;
  202. font-size:11px;
  203. font-family: 'calibri', sans-serif;
  204. margin-right:20px;
  205. padding-left:15px;
  206. color:{color:text};
  207. }
  208. pre{
  209. font-size:9px;
  210. text-align:center;
  211. text-transform:none;
  212. font-family: 'Bitter', serif;
  213. font-weight:bold;
  214. line-height:9px;
  215. border-left:1px solid #eee;
  216. border-bottom:1px solid #eee;
  217. letter-spacing:2px;
  218. background-color:{color:posts};
  219. color:{color:text};
  220. padding:6px;
  221. }
  222. small{
  223. font-size:9px;
  224. font-family: 'calibri', sans-serif;
  225. }
  226. big{
  227. font-size:12px;
  228. font-family: 'calibri', sans-serif;
  229. font-weight:700;
  230. }
  231. sub{
  232. font-size:8px;
  233. letter-spacing:0px;
  234. font-weight:800;
  235. font-family: 'calibri', sans-serif;
  236. }
  237. h1 {
  238. font-size:13px;
  239. text-align:center;
  240. font-family: 'Montserrat', sans-serif;
  241. letter-spacing:1px;
  242. text-transform:uppercase;
  243. font-weight:700;
  244. line-height:17px;
  245. border-bottom:1px solid #eee;
  246. color:{color:text};
  247. padding:7px;
  248. }
  249. h1 a{
  250. color:{color:text};
  251. }
  252. h2{
  253. color:{color:text};
  254. text-transform:uppercase;
  255. font-family: 'Montserrat', sans-serif;
  256. text-align:left;
  257. }
  258. b {
  259. font-weight:bold;
  260. font-family: 'calibri', 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. dy {
  274. color:{color:text};
  275. font-weight:400;
  276. }
  277. sh {
  278. color:{color:links};
  279. text-transform:uppercase;
  280. font-family: 'arial', sans-serif;
  281. font-size:13px
  282. font-weight:800;
  283. }
  284. am {
  285. color:{color:text};
  286. font-size:22px;
  287. padding:8px;
  288. padding-top:2px;
  289. text-transform:uppercase;
  290. font-family: 'roboto', sans-serif;
  291. letter-spacing:0px;
  292. font-weight:500;
  293. }
  294. n {
  295. font-weight:bold;
  296. letter-spacing:-1px;
  297. text-shadow: 1px 1px 1px #cccccc;
  298. font-size:12px;
  299. text-transform:uppercase;
  300. color:{color:text};
  301. }
  302. u {
  303. text-decoration:none;
  304. color:{color:text};
  305. padding:3px;
  306. border-bottom:1px solid {color:border};
  307. }
  308. in {
  309. text-decoration:none;
  310. color:{color:text};
  311. padding:3px;
  312. border-bottom:1px solid {color:border};
  313. }
  314. .links1 {
  315. width:430px;
  316. height:40px;
  317. overflow:hidden;
  318. cursor:pointer;
  319. top:50px;
  320. opacity:1;
  321. z-index:99999;
  322. position:absolute;
  323. margin-left:460px;
  324. text-align:center;
  325. }
  326. .links1 #all {
  327. margin-left:0px;
  328. margin-top:0px;
  329. padding:5px;
  330. height:14px;
  331. }
  332. .links1 #all a:hover {
  333. color:{color:hover};
  334. transition-duration: 0.2s;
  335. -moz-transition-duration: 0.2s;
  336. -webkit-transition-duration: 0.3s;
  337. -o-transition-duration: 0.3s;
  338. }
  339. .links1 a {
  340. width:auto;
  341. height:auto;
  342. margin-bottom:3px;
  343. text-align:center;
  344. text-transform:uppercase;
  345. padding:4px;
  346. line-height:23px;
  347. color:{color:top links};
  348. font-style:italic;
  349. z-index:99999;
  350. font-weight:500;
  351. font-family: 'montserrat', sans-serif;
  352. letter-spacing:1px;
  353. font-size:9px;
  354. display:inline-block;
  355. }
  356. .topp {
  357. top:460px;
  358. position:absolute;
  359. margin-left:180px;
  360. z-index:-9999999999;
  361. height:100%;
  362. width:1000px;
  363. }
  364. .sticky{
  365. position:fixed;
  366. width:1000px;
  367. top:0px;
  368. height:100%;
  369. margin-left:180px;
  370. z-index:-9999999;
  371. }
  372. .sticky #navi{
  373. width:1000px;
  374. height:100%;
  375. text-align:center;
  376. -webkit-transition: all 0.5s ease-in-out;
  377. -moz-transition: all 0.5s ease-in-out;
  378. -o-transition: all 0.5s ease-in-out;
  379. -ms-transition: all 0.5s ease-in-out;
  380. transition: all 0.5s ease-in-out;
  381. }
  382. #navi{
  383. margin:auto;
  384. font-size:11px;
  385. height:100%;
  386. letter-spacing:0px;
  387. width:1000px;
  388. font-weight:none;
  389. background:{color:accent};
  390. text-align:center;
  391. -webkit-transition: all 0.5s ease-in-out;
  392. -moz-transition: all 0.5s ease-in-out;
  393. -o-transition: all 0.5s ease-in-out;
  394. -ms-transition: all 0.5s ease-in-out;
  395. transition: all 0.5s ease-in-out;
  396. }
  397. #titlee{
  398. width:1334px;
  399. height:110px;
  400. box-shadow:0px 2px 3px rgba(0,0,0,.15);
  401. top:0px;
  402. opacity:1;
  403. position:absolute;
  404. font-family: 'arial', sans-serif;
  405. letter-spacing:3px;
  406. font-style:none;
  407. text-align:center;
  408. font-weight:bold;
  409. padding:13px;
  410. color:{color:top links};
  411. text-transform:uppercase;
  412. line-height:45px;
  413. font-size:16px;
  414. margin-left:0px;
  415. background:{color:title};
  416. z-index:9999;
  417. }
  418. #titlee:first-letter {
  419. font-size:20px;
  420. font-weight:bold;
  421. text-align:center;
  422. font-family: 'arial', sans-serif;
  423. color:#ddd;
  424. padding:0px;
  425. }
  426. #header{
  427. position:absolute;
  428. opacity:1;
  429. width:1000px;
  430. height:400px;
  431. top:80px;
  432. background:{color:accent};
  433. margin-left:180px;
  434. z-index:9999999;
  435. }
  436. #header img{
  437. width:1000px;
  438. height:400px;
  439. }
  440. /*header image*/
  441. #header {
  442. position:fixed;
  443. margin-top:190px;
  444. padding:10px;
  445. margin-left:180px;
  446. background-color:transparent;
  447. z-index:9999999999999999;
  448. }
  449. #headerimage {
  450. z-index:-99999;
  451. }
  452. #headerimage img {
  453. width:1000px;
  454. height:400px;
  455. left:180px;
  456. top:80px;
  457. position:absolute;
  458. background:{color:accent};
  459. opacity:1;
  460. z-index:99999;
  461. }
  462. /*back to top button*/
  463. .back-to-top {
  464. position: fixed;
  465. color:{color:text};
  466. bottom:13px;
  467. text-transform:uppercase;
  468. background:{color:background};
  469. left:13px;
  470. font-family: 'lato', sans-serif;
  471. font-size:9px;
  472. letter-spacing:0px;
  473. z-index:9999999999;
  474. font-weight:600;
  475. padding:10px;
  476. }
  477. /*jump pagination*/
  478. .pagination{
  479. font-family: 'roboto', sans-serif;
  480. margin-left:-190px;
  481. width:auto;
  482. padding-top:-10px;
  483. letter-spacing:2px;
  484. padding-bottom:20px;
  485. font-size:13px;
  486. text-align:center;
  487. }
  488. .pagination a{
  489. padding:5px;
  490. font-family: 'roboto', sans-serif;
  491. font-weight:600;
  492. bottom:10px;
  493. margin-left:5px;
  494. color:{color:text};
  495. }
  496. .pagination a:hover{
  497. color:{color:hover};
  498. -moz-transition-duration:0.5s;
  499. -webkit-transition-duration:0.5s;
  500. -o-transition-duration:0.5s;
  501. transition: all 0.3s ease-out;
  502. }
  503. /*post notes*/
  504. ol.notes {
  505. padding: 0px;
  506. margin: 25px 0px;
  507. font-family:'montserrat',sans-serif;
  508. list-style-type: none;
  509. margin-top:-61px;
  510. background:{color:posts};
  511. margin-left:0px;
  512. width:550px;
  513. border-bottom: solid 1px {color:border};
  514. }
  515. ol.notes li.note {
  516. border-top: solid 1px {color:border};
  517. padding: 10px;
  518. }
  519. ol.notes li.note img.avatar {
  520. vertical-align: -10px;
  521. border-radius:100px;
  522. margin-left: 10px;
  523. padding:6px;
  524. width: 16px;
  525. height: 16px;
  526. }
  527. ol.notes li.note span.action {
  528. font-weight: 300;
  529. }
  530. ol.notes li.note .answer_content {
  531. font-weight: normal;
  532. }
  533. ol.notes li.note blockquote {
  534. border-color: {color:border};
  535. padding: 4px 10px;
  536. margin: 10px 0px 0px 25px;
  537. }
  538. ol.notes li.note blockquote a {
  539. text-decoration: none;
  540. }
  541. /*audio*/
  542. .audioartist {
  543. font-family:'roboto', sans-serif;
  544. font-size:10px;
  545. text-transform:lowercase;
  546. font-weight:600;
  547. }
  548. .audiotitle {
  549. font-family:'roboto', sans-serif;
  550. font-size:10px;
  551. text-transform:lowercase;
  552. font-weight:600;
  553. }
  554. .audioplayed {
  555. font-family:'roboto', sans-serif;
  556. font-size:10px;
  557. text-transform:lowercase;
  558. font-weight:600;
  559. }
  560. .audioplayr {
  561. width:400px;
  562. color:{color:text};
  563. background:{color:accent};
  564. }
  565. audioinfo {
  566. font-family:'roboto', sans-serif;
  567. font-size:10px;
  568. letter-spacing:2px;
  569. text-transform:lowercase;
  570. font-weight:300;
  571. }
  572. /*post styles*/
  573. .pcaption{
  574. font-family:'calibri', sans-serif;
  575. font-size:10px;
  576. margin-left:10px;
  577. letter-spacing:0px;
  578. text-transform:none;
  579. font-weight:400;
  580. }
  581. .psets{
  582. max-width:400px;
  583. margin-top:-13px;
  584. height:auto;
  585. -moz-transition-duration:0.5s;
  586. -webkit-transition-duration:0.5s;
  587. -o-transition-duration:0.5s;
  588. transition: all 0.3s ease-out;
  589. }
  590. .psets:hover{
  591. opacity:0.8;
  592. -moz-transition-duration:0.5s;
  593. -webkit-transition-duration:0.5s;
  594. -o-transition-duration:0.5s;
  595. transition: all 0.3s ease-out;
  596. }
  597. .vsets{
  598. max-width:400px;
  599. margin-top:-13px;
  600. height:auto;
  601. -moz-transition-duration:0.5s;
  602. -webkit-transition-duration:0.5s;
  603. -o-transition-duration:0.5s;
  604. transition: all 0.3s ease-out;
  605. }
  606. .vsets:hover{
  607. opacity:0.8;
  608. -moz-transition-duration:0.5s;
  609. -webkit-transition-duration:0.5s;
  610. -o-transition-duration:0.5s;
  611. transition: all 0.3s ease-out;
  612. }
  613. /*posts*/
  614. #entries {
  615. margin-left:200px;
  616. margin-top:440px;
  617. z-index:99999;
  618. }
  619. #post {
  620. font-size:10px;
  621. width:500px;
  622. padding:25px;
  623. color:{color:text};
  624. background-color:{color:posts};
  625. text-align:justify;
  626. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  627. z-index:99999;
  628. margin-bottom:60px;
  629. padding-bottom:0px;
  630. overflow:hidden;
  631. }
  632. #post img{
  633. max-width:500px;
  634. margin-top:-12px;
  635. opacity:1;
  636. height:auto;
  637. -moz-transition-duration:0.5s;
  638. -webkit-transition-duration:0.5s;
  639. -o-transition-duration:0.5s;
  640. transition: all 0.3s ease-out;
  641. }
  642. #post img:hover{
  643. opacity:0.8;
  644. -moz-transition-duration:0.5s;
  645. -webkit-transition-duration:0.5s;
  646. -o-transition-duration:0.5s;
  647. transition: all 0.3s ease-out;
  648. }
  649. #info {
  650. width:512px;
  651. text-align:right;
  652. font-family:consolas;
  653. text-transform:lowercase;
  654. margin-left:-23px;
  655. font-weight:none;
  656. font-size:9px;
  657. margin-top:48px;
  658. letter-spacing:0px;
  659. overflow:hidden;
  660. margin-bottom:-19px;
  661. font-style:none;
  662. padding:10px;
  663. line-height:10px;
  664. color:{color:text};
  665. }
  666. #info a {
  667. text-align:right;
  668. font-family:consolas;
  669. text-transform:lowercase;
  670. font-weight:none;
  671. line-height:5px;
  672. color:{color:text};
  673. }
  674. #info a:hover{
  675. color:{color:hover};
  676. font-weight:none;
  677. }
  678. #tags {
  679. text-align:left;
  680. opacity:1;
  681. font-size:9px;
  682. font-family:'calibri', sans-serif;
  683. margin-top:1px;
  684. margin-left:-5px;
  685. padding:-5px;
  686. font-weight:800;
  687. margin-bottom:7px;
  688. height:15px;
  689. width:530px;
  690. padding-top:0px;
  691. background:{color:posts};
  692. text-transform:lowercase;
  693. transition-duration: 0.5s;
  694. -moz-transition-duration: 0.5s;
  695. -webkit-transition-duration: 0.5s;
  696. -o-transition-duration: 0.5s;
  697. }
  698. #tags a {
  699. padding:0px;
  700. margin-top:1px;
  701. color:{color:text};
  702. line-height:6px;
  703. letter-spacing:1px;
  704. font-weight:800;
  705. margin-left:5px;
  706. font-size:9px;
  707. font-family:'calibri', sans-serif;
  708. text-transform:uppercase;
  709. display:inline-block;
  710. }
  711. #tags a:hover {
  712. -moz-transition-duration:0.3s;
  713. -webkit-transition-duration:0.3s;
  714. -o-transition-duration:0.3s;
  715. color:{color:hover};
  716. }
  717. #permalink{
  718. margin-bottom:10px;
  719. text-align:left;
  720. font-size:9px;
  721. margin-left:-3px;
  722. margin-top:-23px;
  723. font-weight:800;
  724. text-transform:uppercase;
  725. width:auto;
  726. font-family:'calibri', sans-serif;
  727. letter-spacing:1px;
  728. line-height:27px;
  729. color:{color:text};
  730. }
  731. #permalink a{
  732. color:{color:text};
  733. font-family:'calibri', sans-serif;
  734. font-size:9px;
  735. text-transform:uppercase;
  736. font-weight:800;
  737. padding:3px;
  738. }
  739. /*questions and answers*/
  740. #asking {
  741. margin-left:20px;
  742. margin-top:-35px;
  743. }
  744. #askingimage {
  745. }
  746. #askingimage img {
  747. margin-left:20px;
  748. width:30px;
  749. height:30px;
  750. border-radius:100px;
  751. margin-top:0px;
  752. }
  753. #question {
  754. padding:20px;
  755. padding-left:14px;
  756. margin-top:-32px;
  757. margin-left:10px;
  758. width:439px;
  759. font-family: 'roboto', sans-serif;
  760. color:{color:text};
  761. background-color:{color:asks};
  762. }
  763. #asker{
  764. margin-top:-66px;
  765. padding:1px;
  766. font-weight:300;
  767. font-size:11px;
  768. z-index:9999999999;
  769. color:{color:text};
  770. opacity:1;
  771. margin-left:14px;
  772. letter-spacing:0px;
  773. font-family: 'roboto', sans-serif;
  774. text-transform:lowercase;
  775. }
  776. #askerurl{
  777. margin-top:-19px;
  778. padding:1px;
  779. font-weight:500;
  780. font-size:10px;
  781. padding:7px;
  782. line-height:14px;
  783. height:13px;
  784. width:465px;
  785. z-index:9999999999;
  786. color:{color:text};
  787. opacity:1;
  788. margin-left:46px;
  789. padding-bottom:11px;
  790. letter-spacing:0px;
  791. font-family: 'Montserrat', sans-serif;
  792. text-transform:lowercase;
  793. }
  794. /*credit (u better leave this here u goof)*/
  795. #credit{
  796. position:fixed;
  797. font-size:8px;
  798. font-weight:600;
  799. height:20px;
  800. width:20px;
  801. opacity:1;
  802. border-radius:100px;
  803. right:13px;
  804. bottom:13px;
  805. letter-spacing:1px;
  806. line-height:26px;
  807. padding:5px;
  808. text-align:center;
  809. float:left;
  810. font-family: 'lato', sans-serif;
  811. color:{color:text};
  812. text-transform:uppercase;
  813. -moz-transition-duration:0.5s;
  814. -webkit-transition-duration:0.5s;
  815. -o-transition-duration:0.5s;
  816. transition: all 0.3s ease-out;
  817. }
  818. #credit:hover{
  819. opacity:0.5;
  820. -moz-transition-duration:0.5s;
  821. -webkit-transition-duration:0.5s;
  822. -o-transition-duration:0.5s;
  823. transition: all 0.3s ease-out;
  824. }
  825. .tit {
  826. font-size:15px;
  827. text-transform:uppercase;
  828. margin-bottom:0px;
  829. letter-spacing:3px;
  830. line-height:54px;
  831. font-weight:700;
  832. width:359px;
  833. height:50px;
  834. margin-left:-21px;
  835. background:{color:title};
  836. margin-top:-21px;
  837. text-align:left;
  838. font-family: 'work sans', sans-serif;
  839. color:{color:top links};
  840. }
  841. .sidebox {
  842. position:absolute;
  843. width:350px;
  844. top:499px;
  845. left:806px;
  846. z-index:999999999;
  847. }
  848. .box {
  849. padding:20px;
  850. }
  851. #description {
  852. margin:5px;
  853. text-align:justify;
  854. }
  855. .members {
  856. margin:5px;
  857. font-size:10px;
  858. text-transform:uppercase;
  859. text-align:justify;
  860. }
  861. #description1 {
  862. margin:5px;
  863. font-size:10px;
  864. margin-top:0px;
  865. padding-top:8px;
  866. z-index:-9;
  867. background:{color:posts};
  868. margin-left:-21px;
  869. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  870. width:313px;
  871. font-weight:400;
  872. padding:23px;
  873. margin-bottom:50px;
  874. line-height:12px;
  875. font-family: 'arial', sans-serif;
  876. }
  877. .navlinks {
  878. z-index:9999999999;
  879. padding:22px;
  880. text-align:justify;
  881. font-size:10px;
  882. font-weight:500;
  883. margin-bottom:50px;
  884. background:{color:posts};
  885. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  886. line-height:12px;
  887. font-family:'roboto', sans-serif;
  888. margin-left:-21px;
  889. margin-top:0px;
  890. width:315px;
  891. }
  892. .navlinks a{
  893. margin:5px;
  894. width:290px;
  895. height:25px;
  896. margin-bottom:2px;
  897. text-align:left;
  898. padding-bottom:1px;
  899. padding:6px;
  900. line-height:33px;
  901. color:{color:text};
  902. border-bottom:1px solid {color:border};
  903. font-style:none;
  904. z-index:99999;
  905. font-weight:700;
  906. font-family: 'raleway', sans-serif;
  907. letter-spacing:1px;
  908. font-size:9px;
  909. text-transform:uppercase;
  910. text-decoration:none;
  911. display:inline-block;
  912. }
  913. .navlinks a:hover {
  914. padding-left:25px;
  915. width:250px;
  916. border-bottom:1px solid {color:hover};
  917. color:{color:hover};
  918. -webkit-transition: all 0.3s ease-in-out;
  919. -moz-transition: all 0.3s ease-in-out;
  920. -o-transition: all 0.3s ease-in-out;
  921. -ms-transition: all 0.3s ease-in-out;
  922. transition: all 0.3s ease-in-out;
  923. }
  924. #sidebarr {
  925. margin:5px;
  926. text-align:justify;
  927. }
  928. #members {
  929. margin:5px;
  930. font-size:10px;
  931. margin-top:0px;
  932. padding-top:8px;
  933. z-index:-9;
  934. margin-bottom:50px;
  935. background:{color:posts};
  936. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  937. margin-left:-21px;
  938. width:313px;
  939. font-weight:400;
  940. padding:23px;
  941. line-height:14px;
  942. font-family: 'roboto', sans-serif;
  943. }
  944. #binfo {
  945. margin:5px;
  946. font-size:10px;
  947. margin-top:0px;
  948. padding-top:8px;
  949. z-index:-9;
  950. background:{color:posts};
  951. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  952. margin-left:-21px;
  953. width:313px;
  954. text-align:left;
  955. font-weight:400;
  956. padding:23px;
  957. line-height:14px;
  958. font-family: 'roboto', sans-serif;
  959. }
  960. #affiliates {
  961. margin:5px;
  962. font-size:10px;
  963. margin-top:0px;
  964. margin-bottom:50px;
  965. padding-top:8px;
  966. z-index:-9;
  967. background:{color:posts};
  968. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  969. margin-left:-21px;
  970. width:313px;
  971. text-align:center;
  972. letter-spacing:5px;
  973. font-weight:400;
  974. padding:23px;
  975. line-height:17px;
  976. font-family: 'roboto', sans-serif;
  977. }
  978. #affiliates img {
  979. width:60px;
  980. height:60px;
  981. opacity:1;
  982. border-radius:100px;
  983. transition-duration: 0.9s;
  984. -moz-transition-duration:0.9s;
  985. -webkit-transition-duration:0.9s;
  986. -o-transition-duration:0.9s;
  987. }
  988. #affiliates img:hover{
  989. opacity:0.5;
  990. transition-duration: 0.9s;
  991. -moz-transition-duration:0.9s;
  992. -webkit-transition-duration:0.9s;
  993. -o-transition-duration:0.9s;
  994. }
  995. #projects {
  996. font-size:10px;
  997. margin-top:0px;
  998. background:{color:posts};
  999. box-shadow:0 2px 17px 0 rgba(0,0,0,0.1);
  1000. margin-left:-21px;
  1001. width:319px;
  1002. text-align:center;
  1003. margin-bottom:50px;
  1004. font-weight:400;
  1005. padding:20px;
  1006. line-height:12px;
  1007. font-family: 'roboto', sans-serif;
  1008. }
  1009. #projects img {
  1010. border-bottom:1px solid {color:border};
  1011. padding:5px;
  1012. width:165px;
  1013. height:70px;
  1014. margin-left:0px;
  1015. }
  1016. {CustomCSS}</style>
  1017. </head>
  1018. <body>
  1019. <!--basics-->
  1020. <div id="sidebar">
  1021. <div id="titlee">{text:title}</div>
  1022. <div id="description">{description}</div>
  1023. <div id="headerimage"><img src="{image:header}"></a></div>
  1024. <!--sidebar-->
  1025. <div class="sidebox">
  1026. <!--description-->
  1027. <div class="box">
  1028. <div class="tit"style="margin-bottom:-13px">
  1029. <font style="float:left;margin-left:18px">
  1030. Home
  1031. </font style>
  1032. {block:IfShowTextIcons}
  1033. <font style="float:right;margin-right:18px">
  1034. <i class="fa fa-bookmark" style="font-size:13px" aria-hidden="true"></i>
  1035. {/block:IfShowTextIcons}
  1036. </font style>
  1037. </div>
  1038. {block:IfShowSidebarImage}<img src="{image:sidebar}"style="background:{color:hover};margin-left:-21px;margin-top:8px;width:301px;height:200px;"></a>{/block:IfShowSidebarImage}</br>
  1039. <div id="description1">{description}</div>
  1040. </div>
  1041. <!--updates-->
  1042. <div class="box">
  1043. <div class="tit">
  1044. <font style="float:left;margin-left:18px">
  1045. About blog
  1046. </font style>
  1047. {block:IfShowTextIcons}
  1048. <font style="float:right;margin-right:18px">
  1049. <i class="fa fa-calendar" style="font-size:13px" aria-hidden="true"></i>
  1050. {/block:IfShowTextIcons}
  1051. </font style>
  1052. </div>
  1053. <div id="description1"style="text-align:left">
  1054. <img src="{PortraitURL-128}" style="width:60px;height:60px;border-radius:100px" align="right">
  1055. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
  1056.  
  1057. Lorem ipsum dolor sit amet.
  1058. Consectetuer adipiscing elit.
  1059. Nam at tortor quis ipsum tempor aliquet.
  1060. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse sed ligula. Sed volutpat odio non turpis gravida luctus. Praesent elit pede, iaculis facilisis, vehicula mattis, tempus non, arcu.
  1061.  
  1062. </a>
  1063. </div></div>
  1064. <!--projects or albums-->
  1065. <div class="box">
  1066. <div class="tit">
  1067. <font style="float:left;margin-left:18px">
  1068. Projects
  1069. </font style>
  1070. {block:IfShowTextIcons}
  1071. <font style="float:right;margin-right:18px">
  1072. <i class="fa fa-cogs" style="font-size:13px" aria-hidden="true"></i>
  1073. {/block:IfShowTextIcons}
  1074. </font style>
  1075. </div>
  1076. <div id="projects">
  1077. <img src="https://40.media.tumblr.com/d43ef707e6651fa2c632b84265521285/tumblr_ny80wbtVNe1u9o0yqo1_100.jpg">
  1078. </br></br>
  1079. <b>ALBUM NAME</b><br>
  1080. <b>Producer:</b> Name here<br>
  1081. <b>Year:</b> Year here<br>
  1082. <b>Tracks:</b> Tracks amount here<br>
  1083. <b>Label:</b> Label here
  1084. </ul>
  1085. <br><br>
  1086. <img src="https://40.media.tumblr.com/d43ef707e6651fa2c632b84265521285/tumblr_ny80wbtVNe1u9o0yqo1_100.jpg">
  1087. </br></br>
  1088. <b>ALBUM NAME</b><br>
  1089. <b>Producer:</b> Name here<br>
  1090. <b>Year:</b> Year here<br>
  1091. <b>Tracks:</b> Tracks amount here<br>
  1092. <b>Label:</b> Label here
  1093. </ul>
  1094. </div>
  1095. </div>
  1096. <!--navigation-->
  1097. <div class="box">
  1098. <div class="tit">
  1099. <font style="float:left;margin-left:18px">
  1100. navigation
  1101. </font style>
  1102. {block:IfShowTextIcons}
  1103. <font style="float:right;margin-right:18px">
  1104. <i class="fa fa-compass" style="font-size:13px" aria-hidden="true"></i>
  1105. {/block:IfShowTextIcons}
  1106. </font style>
  1107. </div>
  1108. <div class="navlinks">
  1109. <div id="all">
  1110. <a href="/"title="text">navi link</a>
  1111. <a href="/" title="text">navi link</a>
  1112. <a href="/"title="text">navi link</a>
  1113. <a href="/"title="text">navi link</a>
  1114. <a href="/"title="text">navi link</a>
  1115. </div>
  1116. </div>
  1117. </div>
  1118. <!--blog members-->
  1119. <div class="box">
  1120. <div class="tit">
  1121. <font style="float:left;margin-left:18px">
  1122. Members
  1123. </font style>
  1124. {block:IfShowTextIcons}
  1125. <font style="float:right;margin-right:18px">
  1126. <i class="fa fa-group" style="font-size:13px" aria-hidden="true"></i>
  1127. {/block:IfShowTextIcons}
  1128. </font style>
  1129. </div>
  1130. <div id="members">
  1131. {block:GroupMembers}
  1132. <table style="margin-top:0px;">
  1133. {block:GroupMember}
  1134. <tr>
  1135. <td style="width:40px;">
  1136. <img src="{GroupMemberPortraitURL-128}" width="40px;" height="auto;" style="margin-right: 10px;border:solid 7px {color:border};"> </td>
  1137. <td style="height:auto;">
  1138. <a href="{GroupMemberURL}" title="{GroupMemberTitle}"style="font-family: 'josefin sans', sans-serif;margin-top:0px;font-weight:600;text-transform:uppercase;font-size:10px;letter-spacing:0px;text-decoration:underline">{GroupMemberName}</a><br><grouptitle>{GroupMemberTitle}</grouptitle></div>
  1139. </tr>
  1140. {/block:GroupMember}
  1141. </table>
  1142. {/block:GroupMembers}
  1143. </div></div>
  1144. <!--affiliates-->
  1145. <div class="box">
  1146. <div class="tit">
  1147. <font style="float:left;margin-left:18px">
  1148. Affiliates
  1149. </font style>
  1150. {block:IfShowTextIcons}
  1151. <font style="float:right;margin-right:18px">
  1152. <i class="fa fa-globe" style="font-size:13px" aria-hidden="true"></i>
  1153. {/block:IfShowTextIcons}
  1154. </font style>
  1155. </div>
  1156. <div id="affiliates">
  1157. <a href="/"title="name"><img src="https://40.media.tumblr.com/b4692d70631eaa384662efe904f8c8c5/tumblr_o50grjhUqd1ujppofo1_250.jpg"></a>
  1158. <a href="/"title="name"><img src="https://40.media.tumblr.com/b4692d70631eaa384662efe904f8c8c5/tumblr_o50grjhUqd1ujppofo1_250.jpg"></a>
  1159. <a href="/"title="name"><img src="https://40.media.tumblr.com/b4692d70631eaa384662efe904f8c8c5/tumblr_o50grjhUqd1ujppofo1_250.jpg"></a>
  1160. <a href="/"title="name"><img src="https://40.media.tumblr.com/b4692d70631eaa384662efe904f8c8c5/tumblr_o50grjhUqd1ujppofo1_250.jpg"></a>
  1161. <a href="/"title="name"><img src="https://40.media.tumblr.com/b4692d70631eaa384662efe904f8c8c5/tumblr_o50grjhUqd1ujppofo1_250.jpg"></a>
  1162. <a href="/"title="name"><img src="https://40.media.tumblr.com/b4692d70631eaa384662efe904f8c8c5/tumblr_o50grjhUqd1ujppofo1_250.jpg"></a>
  1163. </div></div>
  1164. <!--disclaimer-->
  1165. <div class="box">
  1166. <div class="tit">
  1167. <font style="float:left;margin-left:18px">
  1168. Disclaimer
  1169. </font style>
  1170. {block:IfShowTextIcons}
  1171. <font style="float:right;margin-right:18px">
  1172. <i class="fa fa-exclamation" style="font-size:13px" aria-hidden="true"></i>
  1173. {/block:IfShowTextIcons}
  1174. </font style>
  1175. </div>
  1176. <div id="description1">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
  1177.  
  1178. Lorem ipsum dolor sit amet.
  1179. Consectetuer adipiscing elit.
  1180. Nam at tortor quis ipsum tempor aliquet.
  1181. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse sed ligula. Sed volutpat odio non turpis gravida luctus. Praesent elit pede, iaculis facilisis, vehicula mattis, tempus non, arcu.
  1182. </a>
  1183. </div></div>
  1184. <!--blog info-->
  1185. <div class="box">
  1186. <div class="tit">
  1187. <font style="float:left;margin-left:18px">
  1188. Blog info
  1189. </font style>
  1190. {block:IfShowTextIcons}
  1191. <font style="float:right;margin-right:18px">
  1192. <i class="fa fa-info" style="font-size:13px" aria-hidden="true"></i>
  1193. {/block:IfShowTextIcons}
  1194. </font style>
  1195. </div>
  1196. <div id="binfo">
  1197. <b>Blog created by:</b> Azure
  1198. </br>
  1199. <b>Blog established:</b> Late 2015
  1200. </br>
  1201. <b>Graphics by:</b> Azure
  1202. </br>
  1203. <b>Theme made by:</b> Azure (daddythemes)
  1204. </div>
  1205. </div>
  1206. </div>
  1207. <!--sticky background-->
  1208. </div>
  1209. <div class="topp">
  1210. <div id="navi">
  1211. </div>
  1212. </div>
  1213. <!---- Sticky Position (Bar) with CSS or jQuery by http://www.hongkiat.com/ --->
  1214. <script>
  1215. var header = document.querySelector('.topp');
  1216. var origOffsetY = header.offsetTop;
  1217.  
  1218. function onScroll(e) {
  1219. window.scrollY >= origOffsetY ? header.classList.add('sticky') :
  1220. header.classList.remove('sticky');
  1221. }
  1222.  
  1223. document.addEventListener('scroll', onScroll);
  1224. </script>
  1225. <!--top bar links-->
  1226. <div class="links1"style="z-index:99999">
  1227. <div id="all">
  1228. <a href="/">Index</a>
  1229. <a href="/ask">Contact</a>
  1230. <a href="{text:link one url}">{text:link one}</a>
  1231. <a href="{text:link two url}">{text:link two}</a>
  1232. <a href="{text:link three url}">{text:link three}</a>
  1233. <a href="{text:link four url}">{text:link four}</a>
  1234. </div>
  1235. </div>
  1236. <!--posts and entries-->
  1237. <div id="entries">
  1238. {block:Posts}
  1239. <div id="post"
  1240. <div id="post">
  1241. {block:Date}
  1242. <div id="permalink">
  1243. {block:NotReblog}<a href="{URL}" target="_blank" title="{Name}"></a>{/block:NotReblog}
  1244. <a href="{Permalink}"><i class="fa fa-bookmark"></i> {DayOfMonth} {ShortMonth} {ShortYear} </a> & {NoteCountWithLabel} <a href="{ReblogURL}" title="reblog"target="_blank" class="details"><i class="fa fa-repeat"></i></a>
  1245. <font style="float:right;margin-right:0px;text-transform:uppercase;color:{color:text};letter-spacing:1px">{block:RebloggedFrom}{block:ContentSource}
  1246. <a href="{SourceURL}"title="{ReblogRootName}">src</a> <a href="{ReblogParentURL}" ><a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  1247. {/block:ContentSource}
  1248. {/block:RebloggedFrom}
  1249. </font style>
  1250. </div>
  1251. {/block:Date}
  1252. <!--texts-->
  1253. {block:Text}
  1254. {block:Title}<h1><center>{Title}</center></h1>{/block:Title}
  1255. {Body}
  1256. {/block:Text}
  1257. <!--question and answers-->
  1258. {block:Answer}
  1259. <div id="askingimage"><img src="{AskerPortraitURL-48}"/></div>
  1260. <div id="askerurl">{Asker} asked:</div>
  1261. <div id="question">{Question}</div>
  1262. {Answer}{/block:Answer}
  1263. <!--quotes-->
  1264. {block:Quote}
  1265. {block:Quote}
  1266. <h2>{Quote}</h2>
  1267. <div align="right">
  1268. {block:Source}<h1>-{Source}</h1>{/block:Source}
  1269. </div>
  1270. {/block:Quote}
  1271. <!--links-->
  1272. {block:Link}
  1273. <h2><center><a href="{URL}">{Name}</center></a></h2>
  1274. {block:Description}{Description}{/block:Description}
  1275. {/block:Link}
  1276. <!--chats-->
  1277. {block:Chat}
  1278. {block:Title}<h2>{Title}</h2>{/block:Title}
  1279. <ul class="convo">{block:Lines}<li class="line">{block:Label}<span class ="label">{Label}</span>{/block:Label}
  1280. {Line}</li>{/block:Lines}</ul>
  1281. {/block:Chat}
  1282. <!--photos-->
  1283. {block:Photo}
  1284. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="auto">{LinkCloseTag}
  1285. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  1286. {/block:Photo}
  1287. <!--photosets-->
  1288. {block:Photoset}
  1289. <div class="psets">{Photoset-500}</div>
  1290. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  1291. {/block:Photoset}
  1292. <!--videos-->
  1293. {block:Video}
  1294. <div class="vsets">{Video-500}</div>
  1295. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  1296. {/block:Video}
  1297. <!--audios-->
  1298. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px;" />{/block:AlbumArt}
  1299. {block:TrackName}<div class="audiotitle">Title: <audioinfo>{TrackName}</audioinfo><br/></div>{/block:TrackName}
  1300. {block:Artist}<div class="audioartist">Artist: <audioinfo>{Artist}</audioinfo><br/></div>{/block:Artist}
  1301. {/block:ExternalAudio}<div class="audioplayed">Played: <audioinfo>{PlayCount} times</audioinfo> </div>
  1302. </br>
  1303. <div class="audioplayr"style="background:{color:accent}">{AudioPlayer}</div>
  1304. {/block:Audio}
  1305. <!--tags-->
  1306. {block:IfShowTags}
  1307. {block:HasTags}<div id="tags"> {block:Tags} <a href="{TagURL}"> <i class="fa fa-tag"style="color:{color:text}"></i> {Tag} </a> {/block:Tags}
  1308. </div>
  1309. {/block:HasTags}
  1310. {/block:IfShowTags}
  1311. </div>
  1312.  
  1313. {block:PostNotes} {PostNotes} {/block:PostNotes}
  1314. {/block:Posts}
  1315. {block:Pagination}
  1316. <div class="pagination"style="{color:title text}">
  1317. {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}
  1318. {/block:Pagination}</div>
  1319. </div>
  1320. <!--credit (u better dont touch this here u goof)-->
  1321. <div id="credit">
  1322. <a href="http://ceesty.com/qNgV4R"title="daddythemes"><i class="fa fa-at" style="color:{color:credit};font-size:14px;margin-top:5px"></i></a>
  1323. </div>
  1324. </html>
  1325. </body>
  1326. <!-----end html---->
Advertisement
Add Comment
Please, Sign In to add comment