azurethemes

theme 21 // wild boys

Aug 28th, 2016
823
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 23.46 KB | None | 0 0
  1. <!----
  2. @1204px // prev. daddythemes
  3. theme 21: wild boys
  4. this theme was made by azure/1204px.
  5. dont steal or copy.
  6. --->
  7. <!--start html-->
  8. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  9. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  10. <!--custom google fonts-->
  11. <script type="text/javascript">
  12. WebFontConfig = {
  13. google: { families: [ 'Roboto:400,500,700:latin' , 'Montserrat:400,700:latin' , 'Lato:300,700:latin', 'Raleway:400,700:latin' , 'Maven+Pro:400,900,500,700:latin', 'Karla:400,700:latin', 'Yeseva+One::latin', 'Roboto+Condensed:400,300,300italic,400italic,700,700italic:latin'] }
  14. };
  15. (function() {
  16. var wf = document.createElement('script');
  17. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  18. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  19. wf.type = 'text/javascript';
  20. wf.async = 'true';
  21. var s = document.getElementsByTagName('script')[0];
  22. s.parentNode.insertBefore(wf, s);
  23. })(); </script>
  24. <!--tooltips-->
  25. <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>
  26. <script>
  27. (function($){
  28. $(document).ready(function(){
  29. $("a[title]").style_my_tooltips({
  30. tip_follows_cursor:true,
  31. tip_delay_time:10,
  32. tip_fade_speed:900,
  33. attribute:"title"
  34. });
  35. });
  36. })(jQuery);
  37. </script>
  38. <!-----back to top button---->
  39. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
  40. <script>
  41. $(document).ready(function(){
  42.  
  43. // Der Button wird mit JavaScript erzeugt und vor dem Ende des body eingebunden.
  44. var back_to_top_button = ['<a href="#top" class="back-to-top"><i class="fa fa-arrow-up"></i></a>'].join("");
  45. $("body").append(back_to_top_button)
  46.  
  47. // Der Button wird ausgeblendet
  48. $(".back-to-top").hide();
  49.  
  50. // Funktion für das Scroll-Verhalten
  51. $(function () {
  52. $(window).scroll(function () {
  53. if ($(this).scrollTop() > 100) { // Wenn 100 Pixel gescrolled wurde
  54. $('.back-to-top').fadeIn();
  55. } else {
  56. $('.back-to-top').fadeOut();
  57. }
  58. });
  59.  
  60. $('.back-to-top').click(function () { // Klick auf den Button
  61. $('body,html').animate({
  62. scrollTop: 0
  63. }, 800);
  64. return false;
  65. });
  66. });
  67.  
  68. });
  69. </script>
  70. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  71. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css">
  72. <link rel="stylesheet" href="path/to/material-design-iconic-font/css/material-design-iconic-font.min.css">
  73. <head>
  74. <title>{Title}</title>
  75. <link rel="shortcut icon" href="{Favicon}">
  76. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  77. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  78. <!--all colors-->
  79. <meta name="color:background" content="#ffffff"/>
  80. <meta name="color:text" content="#000000"/>
  81. <meta name="color:links" content="#000000"/>
  82. <meta name="color:border" content="#f6f6f6"/>
  83. <meta name="color:top bar" content="#f6f6f6"/>
  84. <meta name="color:posts" content="#f6f6f6">
  85. <meta name="color:scrollbar" content="#070707">
  86. <meta name="color:asks" content="#f6f6f6">
  87. <meta name="color:hover" content="#888888">
  88. <meta name="color:tooltip" content="#ffffff">
  89. <meta name="color:accent" content="#ffffff">
  90. <meta name="color:side background" content="#ffffff">
  91. <meta name="color:link accent" content="#ffffff">
  92. <!--images-->
  93. <meta name="image:icon" content=""/>
  94. <!--texts-->
  95. <meta name="text:title" content="Wild boys, wild boys"/>
  96. <!--sidebar links-->
  97. <meta name="text:link one" content="Link one">
  98. <meta name="text:link two" content="Link two">
  99. <meta name="text:link three" content="Link three">
  100. <meta name="text:link four" content="Link four">
  101. <meta name="text:link one url" content="/">
  102. <meta name="text:link two url" content="/">
  103. <meta name="text:link three url" content="/">
  104. <meta name="text:link four url" content="/">
  105. <!--custom css-->
  106. <style type="text/css">
  107. /*tumblr controls*/
  108. .tmblr-iframe {
  109. top:0px!important;
  110. position:fixed!important;
  111. opacity:0.5;
  112. -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);
  113. z-index:99999999999999!important;
  114. white-space:nowrap;
  115. transition-duration: 0.3s;
  116. -moz-transition-duration: 0.3s;
  117. -webkit-transition-duration: 0.3s;
  118. -o-transition-duration: 0.3s;
  119. }
  120. /*scrollbar*/
  121. ::-webkit-scrollbar {
  122. width:6px;
  123. height:6px;
  124. background:{color:background};
  125. }
  126. ::-webkit-scrollbar-thumb {
  127. background:{color:scrollbar};
  128. }
  129. /*tooltips*/
  130. #s-m-t-tooltip{
  131. margin:13px 10px 6px 10px;
  132. padding:6px;
  133. background-color:{color:tooltip};
  134. font-family: 'roboto', sans-serif;
  135. border:1px solid {color:border};
  136. font-weight:400;
  137. font-size:9px;
  138. text-transform:none;
  139. letter-spacing:0px;
  140. font-style:italic;
  141. color:{color:text};
  142. z-index:999999999999999999999999999999999999;
  143. transition:0.3s ease-in-out;
  144. -webkit-transition:0.3s ease-in-out;
  145. -moz-transition:0.3s ease-in-out;
  146. -ms-transition:0.3s ease-in-out;
  147. -o-transition:0.3s ease-in-out;
  148. }
  149. /*body basics*/
  150. body{
  151. background-color:{color:background};
  152. background-attachment: fixed;
  153. background-repeat: repeat;
  154. font-weight:none;
  155. font-family: 'roboto', sans-serif;
  156. font-size:10px;
  157. text-align:justify;
  158. color:{color:text};
  159. margin:0;
  160. }
  161. a{
  162. text-decoration:none;
  163. color:{color:links};
  164. -moz-transition-duration:0.5s;
  165. -webkit-transition-duration:0.5s;
  166. -o-transition-duration:0.5s;
  167. transition: all 0.3s ease-out;
  168. }
  169. a:hover{
  170. text-decoration:none;
  171. color:{color:hover};
  172. -moz-transition-duration:0.5s;
  173. -webkit-transition-duration:0.5s;
  174. -o-transition-duration:0.5s;
  175. transition: all 0.3s ease-out;
  176. }
  177. img {
  178. }
  179. blockquote {
  180. font-size:9px;
  181. width:auto;
  182. border-left:2px solid {color:border};
  183. text-align:left;
  184. padding:1px;
  185. font-weight:none;
  186. margin-top:5px;
  187. margin-left:-12px;
  188. padding-top:0.5px;
  189. padding-bottom:0.5px;
  190. font-size:11px;
  191. font-family: 'calibri', sans-serif;
  192. margin-right:20px;
  193. padding-left:15px;
  194. color:{color:text};
  195. }
  196. pre{
  197. font-size:9px;
  198. text-align:center;
  199. text-transform:none;
  200. font-family: 'Bitter', serif;
  201. font-weight:bold;
  202. line-height:9px;
  203. border-left:1px solid #eee;
  204. border-bottom:1px solid #eee;
  205. letter-spacing:2px;
  206. background-color:{color:posts};
  207. color:{color:text};
  208. padding:6px;
  209. }
  210. small{
  211. font-size:9px;
  212. font-family: 'calibri', sans-serif;
  213. }
  214. big{
  215. font-size:12px;
  216. font-family: 'calibri', sans-serif;
  217. font-weight:700;
  218. }
  219. sub{
  220. font-size:8px;
  221. letter-spacing:6px;
  222. font-weight:800;
  223. text-transform:uppercase;
  224. font-family: 'calibri', sans-serif;
  225. }
  226. h1 {
  227. font-size:15px;
  228. text-align:left;
  229. font-family: 'arial', sans-serif;
  230. letter-spacing:-1px;
  231. margin-left:-190px;
  232. text-transform:lowercase;
  233. font-weight:700;
  234. line-height:0px;
  235. color:{color:text};
  236. padding:7px;
  237. }
  238. h1 a{
  239. color:{color:text};
  240. text-align:left;
  241. }
  242. h2{
  243. color:{color:text};
  244. text-transform:uppercase;
  245. font-family: 'Montserrat', sans-serif;
  246. text-align:left;
  247. }
  248. b {
  249. font-weight:bold;
  250. font-family: 'calibri', sans-serif;
  251. color:{color:text};
  252. }
  253. grouptitle {
  254. color:{color:text};
  255. text-transform:none;
  256. font-size:10px;
  257. font-family: 'calibri', sans-serif;
  258. }
  259. sh {
  260. color:{color:links};
  261. text-transform:uppercase;
  262. font-family: 'arial', sans-serif;
  263. font-size:13px
  264. font-weight:800;
  265. }
  266. am {
  267. color:{color:text};
  268. font-size:22px;
  269. padding:8px;
  270. padding-top:2px;
  271. text-transform:uppercase;
  272. font-family: 'roboto', sans-serif;
  273. letter-spacing:0px;
  274. font-weight:500;
  275. }
  276. n {
  277. font-weight:bold;
  278. letter-spacing:-1px;
  279. text-shadow: 1px 1px 1px #cccccc;
  280. font-size:12px;
  281. text-transform:uppercase;
  282. color:{color:text};
  283. }
  284. u {
  285. text-decoration:none;
  286. color:{color:text};
  287. padding:3px;
  288. border-bottom:1px solid {color:border};
  289. }
  290. /*sidebar*/
  291. #sb {
  292. position:fixed;
  293. margin-top:190px;
  294. margin-left:180px;
  295. background-color:transparent;
  296. z-index:9999999999999999;
  297. }
  298. #sbimage {
  299. z-index:-99999;
  300. }
  301. #sbimage img {
  302. width:50px;
  303. height:50px;
  304. left:60px;
  305. top:150px;
  306. position:fixed;
  307. border-radius:5px 5px 5px 5px;
  308. opacity:1;
  309. z-index:99999999;
  310. }
  311. #description {
  312. font-size:10px;
  313. top:150px;
  314. overflow:hidden;
  315. z-index:9999999;
  316. position:fixed;
  317. letter-spacing:0px;
  318. left:120px;
  319. width:200px;
  320. text-align:left;
  321. font-weight:400;
  322. padding:10px;
  323. line-height:16px;
  324. font-family: 'calibri', sans-serif;
  325. }
  326. #sidebackground {
  327. top:0px;
  328. overflow:hidden;
  329. z-index:-9999999;
  330. position:fixed;
  331. height:100%;
  332. left:0px;
  333. width:370px;
  334. background:{color:side background};
  335. }
  336. /*titles*/
  337. #sbtitle3{
  338. top:100px;
  339. width:180px;
  340. height:20px;
  341. opacity:1;
  342. position:fixed;
  343. font-family: 'karla', sans-serif;
  344. letter-spacing:0px;
  345. text-align:left;
  346. overflow:hidden;
  347. border-bottom:1px solid {color:border};
  348. font-weight:800;
  349. background:{color:top bar};
  350. word-wrap:none;
  351. color:{color:text};
  352. padding:1px;
  353. text-transform:uppercase;
  354. line-height:14px;
  355. font-size:12px;
  356. left:61px;
  357. z-index:99;
  358. }
  359. /*back to top button*/
  360. .back-to-top {
  361. position: fixed;
  362. color:{color:text};
  363. bottom:10px;
  364. text-transform:uppercase;
  365. left:10px;
  366. font-family: 'calibri', sans-serif;
  367. font-size:8px;
  368. letter-spacing:3px;
  369. z-index:9999999999;
  370. font-weight:600;
  371. padding:10px;
  372. }
  373. /*jump pagination*/
  374. .pagination{
  375. font-family: 'roboto', sans-serif;
  376. margin-left:-190px;
  377. width:auto;
  378. padding-top:-10px;
  379. letter-spacing:2px;
  380. padding-bottom:20px;
  381. font-size:13px;
  382. text-align:center;
  383. }
  384. .pagination a{
  385. padding:5px;
  386. font-family: 'roboto', sans-serif;
  387. font-weight:600;
  388. bottom:10px;
  389. margin-left:5px;
  390. color:{color:text};
  391. }
  392. .pagination a:hover{
  393. color:{color:hover};
  394. -moz-transition-duration:0.5s;
  395. -webkit-transition-duration:0.5s;
  396. -o-transition-duration:0.5s;
  397. transition: all 0.3s ease-out;
  398. }
  399. /*post notes*/
  400. ol.notes {
  401. padding: 0px;
  402. margin: 25px 0px;
  403. font-family:'roboto',sans-serif;
  404. list-style-type: none;
  405. margin-top:-134px;
  406. background:{color:posts};
  407. margin-left:15px;
  408. width:440px;
  409. border: solid 1px {color:border};
  410. }
  411. ol.notes li.note {
  412. border-top: solid 1px {color:border};
  413. padding: 10px;
  414. }
  415. ol.notes li.note img.avatar {
  416. vertical-align: -10px;
  417. border-radius:100px;
  418. margin-left: 10px;
  419. padding:6px;
  420. width: 16px;
  421. height: 16px;
  422. }
  423. ol.notes li.note span.action {
  424. font-weight: 300;
  425. }
  426. ol.notes li.note .answer_content {
  427. font-weight: normal;
  428. }
  429. ol.notes li.note blockquote {
  430. border-color: {color:border};
  431. padding: 4px 10px;
  432. margin: 10px 0px 0px 25px;
  433. }
  434. ol.notes li.note blockquote a {
  435. text-decoration: none;
  436. }
  437. .buttons a {
  438. position:relative;
  439. display:inline-block;
  440. padding:3px;
  441. }
  442. .custom-like-button {
  443. position: relative;
  444. display: inline-block;
  445. width: 12px;
  446. height: 12px;
  447. cursor: pointer;
  448. }
  449. .like_button {
  450. position: absolute;
  451. top: 0px;
  452. left: -2px;
  453. right: 0;
  454. bottom: -1px;
  455. width: 12px;
  456. height: 12px;
  457. opacity: 0;
  458. z-index: 10;
  459. }
  460. .like_button iframe {
  461. width: 100% !important;
  462. height: 100% !important;
  463. }
  464. .our_button {
  465. position: absolute;
  466. top: 1.5px;
  467. left: 0;
  468. right: 0;
  469. bottom: 0;
  470. width: 100%;
  471. height: 100%;
  472. z-index: 1;
  473. -webkit-transition:all 0.6s ease-in-out;/*chrome-safari*/
  474. -o-transition:all 0.6s ease-in-out;/*opera*/
  475. -moz-transition:all 0.6s ease-in-out;/*mozilla firefox*/
  476. -ms-transition:all 0.6s ease-in-out;/*ie*/
  477. transition:all 0.6s ease-in-out;/*w3c*/
  478. }
  479. .like_button:hover + .our_button {
  480. color: {color:link hover};
  481. }
  482. .like_button.liked + .our_button {
  483. color: red;
  484. }
  485. /*audio*/
  486. .audioartist {
  487. font-family:'roboto', sans-serif;
  488. font-size:10px;
  489. text-transform:lowercase;
  490. font-weight:600;
  491. }
  492. .audiotitle {
  493. font-family:'roboto', sans-serif;
  494. font-size:10px;
  495. text-transform:lowercase;
  496. font-weight:600;
  497. }
  498. .audioplayed {
  499. font-family:'roboto', sans-serif;
  500. font-size:10px;
  501. text-transform:lowercase;
  502. font-weight:600;
  503. }
  504. .audioplayr {
  505. width:400px;
  506. color:{color:text};
  507. background:{color:accent};
  508. }
  509. audioinfo {
  510. font-family:'roboto', sans-serif;
  511. font-size:10px;
  512. letter-spacing:2px;
  513. text-transform:lowercase;
  514. font-weight:300;
  515. }
  516. /*post styles*/
  517. .pcaption{
  518. font-family:'roboto', sans-serif;
  519. font-size:10px;
  520. margin-left:15px;
  521. letter-spacing:0px;
  522. text-transform:none;
  523. text-align:left;
  524. background:{color:posts};
  525. font-weight:400;
  526. }
  527. .pcaption a{
  528. font-size:10px;
  529. letter-spacing:0.5px;
  530. font-family:'raleway', sans-serif;
  531. text-transform:lowercase;
  532. font-weight:500;
  533. }
  534. .psets{
  535. width:100%;
  536. margin-top:-12px;
  537. }
  538. .vsets{
  539. width:100%;
  540. margin-top:-12px;
  541. }
  542. .qcaption{
  543. font-family:'Vidaloka', sans-serif;
  544. font-size:15px;
  545. margin-left:15px;
  546. letter-spacing:0px;
  547. text-align:justify;
  548. text-transform:none;
  549. color:{color:text};
  550. font-weight:200;
  551. }
  552. .qsource{
  553. font-size:12px;
  554. margin-left:30px;
  555. margin-top:12px;
  556. text-align:left;
  557. letter-spacing:0px;
  558. font-family:'calibri', sans-serif;
  559. text-transform:uppercase;
  560. font-style:italic;
  561. font-weight:300;
  562. }
  563. /*posts*/
  564. #entries {
  565. margin-left:485px;
  566. margin-top:66px;
  567. z-index:9999999999999999999999999;
  568. }
  569. #post {
  570. font-size:10px;
  571. width:400px;
  572. color:{color:text};
  573. background-color:{color:posts};
  574. text-align:justify;
  575. z-index:99999999999;
  576. border:1px solid {color:border};
  577. border-radius:3px;
  578. padding:30px;
  579. margin-left:15px;
  580. margin-bottom:130px;
  581. padding-bottom:0px;
  582. overflow:hidden;
  583. }
  584. #post img{
  585. max-width:100%;
  586. margin-top:-12px;
  587. height:auto;
  588. }
  589. /*questions and answers*/
  590. #asking {
  591. margin-left:20px;
  592. margin-top:-35px;
  593. }
  594. #askingimage {
  595. }
  596. #askingimage img {
  597. margin-left:10px;
  598. width:30px;
  599. height:30px;
  600. border-radius:100px;
  601. margin-top:-30px;
  602. }
  603. #question {
  604. padding:20px;
  605. padding-left:14px;
  606. margin-top:-32px;
  607. margin-left:0px;
  608. width:368px;
  609. font-family: 'calibri', serif;
  610. color:{color:text};
  611. background-color:{color:asks};
  612. }
  613. #answer {
  614. font-size:9px;
  615. width:auto;
  616. text-align:left;
  617. padding:1px;
  618. font-weight:none;
  619. margin-top:5px;
  620. margin-left:-3px;
  621. font-size:10px;
  622. font-family: 'calibri', sans-serif;
  623. margin-right:20px;
  624. padding-left:15px;
  625. color:{color:text};
  626. }
  627. #asker{
  628. margin-top:-66px;
  629. padding:1px;
  630. font-weight:300;
  631. font-size:11px;
  632. z-index:9999999999;
  633. color:{color:text};
  634. opacity:1;
  635. margin-left:34px;
  636. letter-spacing:0px;
  637. font-family: 'roboto', sans-serif;
  638. text-transform:uppercase;
  639. }
  640. #askerurl{
  641. margin-top:-19px;
  642. padding:1px;
  643. font-weight:800;
  644. font-size:8px;
  645. padding:7px;
  646. line-height:14px;
  647. height:13px;
  648. width:465px;
  649. z-index:9999999999;
  650. color:{color:text};
  651. opacity:1;
  652. margin-left:36px;
  653. padding-bottom:13px;
  654. letter-spacing:1px;
  655. font-family: 'calibri', sans-serif;
  656. text-transform:uppercase;
  657. }
  658. /*post info*/
  659. #info {
  660. width:440px;
  661. text-align:left;
  662. font-family: 'roboto', sans-serif;
  663. text-transform:uppercase;
  664. margin-left:-30px;
  665. font-size:8px;
  666. margin-top:25px;
  667. padding-left:20px;
  668. padding-top:16px;
  669. padding-bottom:13px;
  670. opacity:1;
  671. overflow:hidden;
  672. font-weight:400;
  673. border-top:1px solid {color:border};
  674. line-height:14px;
  675. letter-spacing:1px;
  676. background:{color:top bar};
  677. z-index:9999999999999999;
  678. color:{color:top links};
  679. }
  680. #info a {
  681. text-align:left;
  682. font-weight:400;
  683. padding:2px;
  684. letter-spacing:1px;
  685. font-family: 'roboto', sans-serif;
  686. line-height:5px;
  687. color:{color:top links};
  688. -moz-transition-duration:0.2s;
  689. -webkit-transition-duration:0.2s;
  690. -o-transition-duration:0.2s;
  691. transition: all 0.2s ease-out;
  692. }
  693. #info a:hover{
  694. color:{color:hover};
  695. -moz-transition-duration:0.2s;
  696. -webkit-transition-duration:0.2s;
  697. -o-transition-duration:0.2s;
  698. transition: all 0.2s ease-out;
  699. }
  700. #info date {
  701. font-size:8px;
  702. letter-spacing:0px;
  703. font-family: 'montserrat', sans-serif;
  704. font-weight:600;
  705. color:{color:link accent};
  706. -moz-transition-duration:0.2s;
  707. -webkit-transition-duration:0.2s;
  708. -o-transition-duration:0.2s;
  709. transition: all 0.2s ease-out;
  710. }
  711. #info date:hover{
  712. color:{color:hover};
  713. -moz-transition-duration:0.2s;
  714. -webkit-transition-duration:0.2s;
  715. -o-transition-duration:0.2s;
  716. transition: all 0.2s ease-out;
  717. }
  718. #infot {
  719. width:540px;
  720. text-align:left;
  721. font-family: 'Roboto Condensed', sans-serif;
  722. text-transform:uppercase;
  723. margin-left:-30px;
  724. font-size:9px;
  725. margin-top:-15px;
  726. padding-left:20px;
  727. padding-top:15px;
  728. padding-bottom:21px;
  729. margin-bottom:40px;
  730. opacity:1;
  731. overflow:hidden;
  732. font-weight:800;
  733. border-bottom:1px solid {color:border};
  734. line-height:0px;
  735. letter-spacing:1px;
  736. background:{color:top bar};
  737. z-index:9999999999999999;
  738. color:{color:top links};
  739. }
  740. #infot a {
  741. text-align:left;
  742. font-weight:500;
  743. padding:2px;
  744. letter-spacing:1px;
  745. height:20px;
  746. margin-left:10px;
  747. margin-top:-12px;
  748. font-family: 'Roboto Condensed', sans-serif;
  749. line-height:0px;
  750. color:{color:top links};
  751. -moz-transition-duration:0.2s;
  752. -webkit-transition-duration:0.2s;
  753. -o-transition-duration:0.2s;
  754. transition: all 0.2s ease-out;
  755. }
  756. #infot img {
  757. width:20px;
  758. height:20px;
  759. border-radius:3px;
  760. }
  761. #infot #nname {
  762. text-align:left;
  763. font-weight:700;
  764. padding:2px;
  765. font-size:8px;
  766. letter-spacing:1px;
  767. margin-left:28px;
  768. margin-top:-12px;
  769. font-family: 'montserrat', sans-serif;
  770. line-height:0px;
  771. color:{color:top links};
  772. -moz-transition-duration:0.2s;
  773. -webkit-transition-duration:0.2s;
  774. -o-transition-duration:0.2s;
  775. transition: all 0.2s ease-out;
  776. }
  777. /*sidebar links*/
  778. .links {
  779. width:110px;
  780. height:110px;
  781. overflow:hidden;
  782. cursor:pointer;
  783. left:43px;
  784. border-radius:3px;
  785. opacity:1;
  786. z-index:99;
  787. position:fixed;
  788. top:218px;
  789. text-align:left;
  790. }
  791. .links #box {
  792. margin-left:10px;
  793. margin-top:3px;
  794. }
  795. .links a {
  796. width:100px;
  797. height:20px;
  798. border-radius:100px;
  799. text-align:left;
  800. text-transform:uppercase;
  801. opacity:1;
  802. color:{color:links};
  803. padding:2px;
  804. z-index:99999;
  805. margin-top:-2px;
  806. padding-left:6px;
  807. line-height:14px;
  808. letter-spacing:0.5px;
  809. font-weight:500;
  810. font-family: 'montserrat', sans-serif;
  811. font-size:8px;
  812. display:inline-block;
  813. transition-duration: 0.3s;
  814. -moz-transition-duration: 0.3s;
  815. -webkit-transition-duration: 0.3s;
  816. -o-transition-duration: 0.3s;
  817. }
  818. .links a:hover{
  819. color:{color:hover};
  820. }
  821. /*credit (u better leave this here u goof)*/
  822. #credit a{
  823. position:fixed;
  824. font-size:9px;
  825. font-weight:800;
  826. height:15px;
  827. width:25px;
  828. opacity:1;
  829. right:15px;
  830. bottom:5px;
  831. padding:2px;
  832. letter-spacing:0px;
  833. padding-top:3px;
  834. line-height:11px;
  835. z-index:9999999999999999999999999999;
  836. text-align:center;
  837. float:left;
  838. font-family: 'montserrat', cursive;
  839. color:{color:text};
  840. text-transform:lowercase;
  841. -moz-transition-duration:0.3s;
  842. -webkit-transition-duration:0.3s;
  843. -o-transition-duration:0.3s;
  844. transition: all 0.3s ease-out;
  845. }
  846. #credit a:hover{
  847. color:{color:hover};
  848. -moz-transition-duration:0.3s;
  849. -webkit-transition-duration:0.3s;
  850. -o-transition-duration:0.3s;
  851. transition: all 0.3s ease-out;
  852. }
  853. {CustomCSS}</style>
  854. </head>
  855. <body>
  856. <!--basics-->
  857. <div id="sidebar">
  858. <div id="sbimage"><img src="{image:icon}"></a></div>
  859. <div id="sbtitle3">{text:title}</div>
  860. <div id="description">{description}</div>
  861. <div id="sidebackground"></div>
  862. </div>
  863. <div class="links">
  864. <div id="box">
  865. <a href="/"><i class="fa fa-angle-right fa-fw" aria-hidden="true"></i> Home</a>
  866. <a href="/ask"><i class="fa fa-angle-right fa-fw" aria-hidden="true"></i> Message</a>
  867. <a href="{text:link one url}"><i class="fa fa-angle-right fa-fw" aria-hidden="true"></i> {text:link one}</a>
  868. <a href="{text:link two url}"><i class="fa fa-angle-right fa-fw" aria-hidden="true"></i> {text:link two}</a>
  869. <a href="{text:link three url}"><i class="fa fa-angle-right fa-fw" aria-hidden="true"></i> {text:link three}</a>
  870. </div></div></div>
  871. <!--posts and entries-->
  872. <div id="entries">
  873. {block:Posts}
  874. {block:NoRebloggedFrom}
  875. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  876. {/block:NoRebloggedFrom}
  877. {block:ContentSource}<!-- {SourceURL}
  878. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  879. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  880. {/block:ContentSource}
  881. <div id="post">
  882. <div id="infot">
  883. <div id="permalink">
  884. <img src="{PortraitURL-128}"></a> <a href="https://{Name}.tumblr.com"><div id="nname">{Name}</div></a>
  885. </div></div>
  886. <!--texts-->
  887. {block:Text}
  888. {block:Title}<h1><center>{Title}</center></h1>{/block:Title}
  889. {Body}
  890. {/block:Text}
  891. <!--question and answers-->
  892. {block:Answer}
  893. <div id="askingimage"><img src="{AskerPortraitURL-48}"/></div>
  894. <div id="askerurl">{Asker} asked:</div>
  895. <div id="question">{Question}</div>
  896. <div id="answer">{Answer}</div>{/block:Answer}
  897. <!--quotes-->
  898. {block:Quote}
  899. {block:Quote}
  900. <div class="qcaption">{Quote}</div>
  901. <div class="qsource">
  902. {block:Source}- {Source}{/block:Source}
  903. </div>
  904. {/block:Quote}
  905. <!--links-->
  906. {block:Link}
  907. <h2><center><a href="{URL}">{Name}</center></a></h2>
  908. {block:Description}{Description}{/block:Description}
  909. {/block:Link}
  910. <!--chats-->
  911. {block:Chat}
  912. {block:Title}<h2>{Title}</h2>{/block:Title}
  913. <ul class="convo">{block:Lines}<li class="line">{block:Label}<span class ="label">{Label}</span>{/block:Label}
  914. {Line}</li>{/block:Lines}</ul>
  915. {/block:Chat}
  916. <!--photos-->
  917. {block:Photo}
  918. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="auto">{LinkCloseTag}
  919. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  920. {/block:Photo}
  921. <!--photosets-->
  922. {block:Photoset}
  923. <div class="psets">{Photoset}</div>
  924. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  925. {/block:Photoset}
  926. <!--videos-->
  927. {block:Video}
  928. <div class="vsets">{Video}</div>
  929. {block:Caption}<div class="pcaption">{Caption}</div>{/block:Caption}
  930. {/block:Video}
  931. <!--audios-->
  932. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px;" />{/block:AlbumArt}
  933. {block:TrackName}<div class="audiotitle">Title: <audioinfo>{TrackName}</audioinfo><br/></div>{/block:TrackName}
  934. {block:Artist}<div class="audioartist">Artist: <audioinfo>{Artist}</audioinfo><br/></div>{/block:Artist}
  935. {/block:ExternalAudio}<div class="audioplayed">Played: <audioinfo>{PlayCount} times</audioinfo> </div>
  936. </br>
  937. <div class="audioplayr"style="background:{color:accent}">{AudioPlayer}</div>
  938. {/block:Audio}
  939. <!--info-->
  940. <div id="info">
  941. <div id="permalink">
  942. <a href="{Permalink}"title="{TimeAgo}"><date>{Month} {DayOfMonth}{DayOfMonthSuffix}</date></a> {NoteCountWithLabel}
  943. <font style="float:right;margin-right:20px"> <a href="{ReblogURL}" title="reblog"target="_blank" class="details"><i class="zmdi zmdi-refresh"style="font-size:11px"></i>
  944. </a><div class="custom-like-button">{LikeButton}<span class="our_button"><i class="fa fa-heart-o fa-fw" aria-hidden="true"style="font-size:10px"></i></span></div></font style>
  945. {/block:ContentSource}
  946. {/block:RebloggedFrom}
  947. </div>
  948. {/block:Date}
  949. {block:HasTags} {block:Tags} <a href="{TagURL}"> #{Tag} </a> {/block:Tags}
  950.  
  951. {/block:HasTags}
  952. </div></div>
  953. {block:PostNotes} {PostNotes} {/block:PostNotes}
  954. {/block:Posts}
  955. {block:Pagination}
  956. <div class="pagination"style="{color:title text}">
  957. {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}
  958. {/block:Pagination}</div>
  959. </div>
  960. <!--credit(u better dont touch this here u goof)-->
  961. <div id="credit">
  962. <a href="http://ceesty.com/qNgV4R"title="theme credit">1204px</a>
  963. </div>
  964. </html>
  965. </body>
  966. <!--end html-->
Add Comment
Please, Sign In to add comment