API tools faq
paste
Advertisement
destinatia

「 ✩ * º ╳ GRYFFINDOR by becca. 」

destinatia
Jan 24th, 2017
4,217
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. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!-- ✧ * ☾ desveladas ™ * ✧
  6. aka bec -->
  7.  
  8. {block:Description}
  9. <meta name="description" content="{MetaDescription}" />
  10. {/block:Description}
  11. <meta charset="utf-8">
  12. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  13. <title>{Title}{block:TagPage} // {Tag} {/block:TagPage} {block:SearchPage} // {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary} // {PostSummary} {/block:PostSummary}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16.  
  17. <!---------------------- ✕ color customization ✕ ----------------------->
  18.  
  19. <meta name="color:background" content="#ffffff" />
  20. <meta name="color:title text" content="#ccc" />
  21. <meta name="color:topbar" content="#fff" />
  22. <meta name="color:description" content="#ffffff" />
  23. <meta name="color:desc text" content="#ddd" />
  24. <meta name="color:posts" content="#ffffff" />
  25. <meta name="color:text" content="#000000" />
  26. <meta name="color:links" content="#000000" />
  27. <meta name="color:links hover" content="#a0a0a0" />
  28. <meta name="color:accent" content="#ffffff" />
  29. <meta name="color:accent text" content="#ffffff" />
  30. <meta name="color:desc accent" content="#ffffff" />
  31. <meta name="color:asks borders" content="#eee" />
  32.  
  33. <!--------------------------- ✕ texts ✕ ------------------------------->
  34.  
  35. <meta name="text:alt title" content="two lines look better" />
  36. <meta name="text:a brief quote" content="anything" />
  37. <meta name="text:link 1" content="/" />
  38. <meta name="text:link 2" content="/ask" />
  39. <meta name="text:link 3" content="/more" />
  40. <meta name="text:link 4" content="/and" />
  41.  
  42. <!---------------------------- ✕ images ✕ ----------------------------->
  43.  
  44. <meta name="image:sbicon" content="" />
  45. <meta name="image:background" content="" />
  46.  
  47. <!---------------------------- ✕ options ✕ ----------------------------->
  48.  
  49. <meta name="if:400px posts" content="1"/>
  50.  
  51.  
  52. <!---------------------- ✕ tooltip script ! ✕ ----------------------->
  53.  
  54.  
  55. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  56. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  57. <script>
  58. (function($){
  59. $(document).ready(function(){
  60. $("a[title]").style_my_tooltips({
  61. tip_follows_cursor:true,
  62. tip_delay_time:90,
  63. tip_fade_speed:600,
  64. attribute:"title"
  65. });
  66. });
  67. })(jQuery);
  68. </script>
  69.  
  70. <!---------------------- ✕ imported scripts ✕ ----------------------->
  71.  
  72. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  73.  
  74. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  75.  
  76. <link href="https://file.myfontastic.com/DcfqceUudTWXik9Ue2LfGV/icons.css" rel="stylesheet">
  77.  
  78. <script src="https://file.myfontastic.com/DcfqceUudTWXik9Ue2LfGV/icons.js"></script>
  79.  
  80. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  81.  
  82. <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
  83.  
  84. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  85.  
  86. <script src="https://cdn.linearicons.com/free/1.0.0/svgembedder.min.js"></script>
  87.  
  88. <link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" />
  89.  
  90. <style type="text/css">
  91.  
  92. /* ---------------------- ✕ imported fonts ✕ ----------------------- */
  93.  
  94. @font-face { font-family: "novitha script"; src: url('https://dl.dropboxusercontent.com/s/x11mues6vdmjvxo/Novitha%20Script-Demo.otf?dl=0'); format("truetype");}
  95.  
  96. @font-face { font-family: "beauty and the beast"; src: url('https://dl.dropboxusercontent.com/s/9oafyhyti3s9xd2/Beauty%20and%20the%20Beast%20Sample.ttf?dl=0'); format("truetype");}
  97.  
  98. /* ------------------------ ✕ selection tool ✕ ----------------------- */
  99.  
  100. ::-moz-selection {
  101. background: {color:accent};
  102. color: {color:background};
  103. }
  104.  
  105. ::selection {
  106. background: {color:accent};
  107. color: {color:background};
  108. }
  109.  
  110. /* ------------------------ ✕ scrollbar ✕ ----------------------- */
  111. ::-webkit-scrollbar {
  112. width: 1px;
  113. visibility:none;
  114. }
  115.  
  116. ::-webkit-scrollbar-track {
  117. border-radius:50%;
  118. visibility:none;
  119. }
  120.  
  121. ::-webkit-scrollbar-thumb {
  122. background:{color:accent};
  123. visibility:none;
  124. }
  125. ::-webkit-scrollbar-thumb:window-inactive {
  126. background: transparent;
  127. }
  128.  
  129. /* ------------------------ ✕ tooltip style ✕ ----------------------- */
  130.  
  131. #s-m-t-tooltip {
  132. max-width:300px;
  133. padding:5px;
  134. margin:10px 0px 0px 10px;
  135. background-color:{color:background};
  136. font-size:7px;
  137. z-index:999999999999999999999999999999999999;
  138. }
  139.  
  140.  
  141. /* ---------------------------- ✕ basics ✕ -------------------------- */
  142.  
  143. body {
  144. background-color:{color:background};
  145. color: {color:text};
  146. overflow-y:hidden;
  147. overflow-x:auto;
  148. font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
  149. font-size: 9px;
  150. text-transform:auto;
  151. margin: 0;
  152. letter-spacing:3px;
  153. padding: 0;
  154. word-wrap: break-word;
  155. line-height:160%;
  156. background-image:url('{image:background}');
  157. }
  158.  
  159. blockquote {
  160. background:{color:description};
  161. border-radius:7px;
  162. margin: 10px;
  163. color:{color:desc text};
  164. padding-left:20px;
  165. padding-top:10px;
  166. padding-right:20px;
  167. padding-bottom:10px;
  168. }
  169.  
  170. blockquote a{
  171. color:{color:desc accent};
  172. }
  173.  
  174. blockquote b{
  175. color:{color:desc accent};
  176. }
  177.  
  178. blockquote i{
  179. color:{color:desc accent};
  180. }
  181.  
  182. blockquote s{
  183. color:{color:desc accent};
  184. }
  185.  
  186. blockquote u{
  187. color:{color:desc accent};
  188. }
  189.  
  190. iframe, img, embed, object, video {
  191. max-width: 100%;
  192. }
  193.  
  194. p{
  195. margin-bottom:10px;
  196. }
  197.  
  198.  
  199. ul{
  200. list-style-type:circle;
  201. }
  202.  
  203. ol{
  204. list-style-type:;
  205. }
  206.  
  207. /* ------------------------ ✕ text styles ! ✕ ----------------------- */
  208.  
  209. a {
  210. color: {color:links};
  211. text-decoration: none;
  212. }
  213.  
  214. b, strong {
  215. color: {color:accent};
  216. font-family: 'Quicksand', sans-serif;
  217.  
  218. }
  219.  
  220. i, em,italic {
  221. color: {color:accent};
  222. font-family: 'Quicksand', sans-serif;
  223.  
  224. }
  225.  
  226. s, strike {
  227. color: {color:accent};
  228. font-family: 'Quicksand', sans-serif;
  229.  
  230. }
  231.  
  232. u,underline {
  233. color: {color:accent};
  234. font-family: 'Quicksand', sans-serif;
  235.  
  236. }
  237.  
  238. sup, sub, small {
  239. font-size:8.5px;
  240. line-height:160%;
  241. }
  242.  
  243. h2 {
  244. font-family:'montserrat', sans serif;
  245. font-size:18px;
  246. font-style:italic;
  247. text-align:center;
  248. color: {color:accent};
  249. }
  250.  
  251. h1{
  252. text-transform:uppercase;
  253. font-size:13px;
  254. }
  255.  
  256. /* ------------------------ ✕ posts bruh ! ✕ ----------------------- */
  257.  
  258. article {
  259. float:left;
  260. background:{color:posts};
  261. padding: 10px;
  262. {block:ifnot400pxposts}
  263. width: 300px;
  264. {/block:ifnot400pxposts}
  265. {block:if400pxposts}
  266. width: 400px;
  267. {/block:if400pxposts}
  268. z-index:9;
  269. text-align:justify;
  270. margin-bottom:20px;
  271. border-radius:7px 7px 0px 0px;
  272. }
  273.  
  274. .postitle {
  275. text-align:right;
  276. font-size:33px;
  277. line-height:100%;
  278. text-transform:lowercase;
  279. font-family: 'novitha script';
  280. padding:5px;
  281. width:auto;
  282. border-radius: 0px 100px 100px 0px;
  283. background:{color:topbar};
  284. margin:auto;
  285. }
  286.  
  287. .postitle a{
  288. text-transform:lowercase;
  289. color:{color:title text};
  290. }
  291.  
  292. /* --------------------- ✕ permalinks i think ! ✕ -------------------- */
  293.  
  294. .perms {
  295. font-family: 'Quicksand', sans-serif;
  296. color:{color:title text};
  297. font-size:9px;
  298. margin-left:10px;
  299. text-transform:lowercase;
  300. }
  301.  
  302. /* ------------------------ ✕ post info ! ✕ ----------------------- */
  303.  
  304. .gryffindor{
  305. {block:ifnot400pxposts}
  306. width: 310px;
  307. margin-left:-10px;
  308. {/block:ifnot400pxposts}
  309. {block:if400pxposts}
  310. width: 410px;
  311. margin-left:-10px;
  312. {/block:if400pxposts}
  313. margin-top:-10px;
  314. padding:5px;
  315. margin-bottom:10px;
  316. border-radius:7px 7px 0px 0px;
  317. background:{color:topbar};
  318. }
  319.  
  320. .btton{
  321. float:right;
  322. margin-right:5px;
  323. font-size:12px;
  324. }
  325.  
  326. .btton a{
  327. color:{color:accent text};
  328. }
  329.  
  330. .postinfo{
  331. margin-top:10px;
  332. text-align:center;
  333. font-weight:bold;
  334. padding-top:8px;
  335. text-transform:uppercase;
  336. }
  337.  
  338. .tags {
  339. margin-top:5px;
  340. background:{color:accent};
  341. padding:5px;
  342. font-size:9px;
  343. letter-spacing:1px;
  344. font-weight:normal;
  345. -webkit-transition: all .7s;
  346. -moz-transition: all .7s;
  347. -o-transition: all .7s;
  348. -ms-transition: all .7s;
  349. transition: all .7s;
  350. }
  351.  
  352. .tags a{
  353. color:{color:posts};
  354. }
  355.  
  356. .tags i{
  357. color:{color:posts};
  358. }
  359.  
  360.  
  361.  
  362. /* ---------------------- ✕ notes and shit ! ✕ ----------------------- */
  363.  
  364. ol.notes {
  365. display:block;
  366. text-align:left;
  367. list-style-type:none;
  368. margin-left:-40px;
  369. }
  370.  
  371. ol.notes li.note{
  372. margin-bottom:5px;
  373. }
  374.  
  375. .pagenotes {
  376. text-align:left;
  377. margin-top:15px;
  378. }
  379.  
  380. .pagenotes img{
  381. padding-right:5px;
  382. padding-top:5px;
  383. margin-bottom:-5px;
  384. }
  385.  
  386. /* ------------------------ ✕ post types ! ✕ ----------------------- */
  387.  
  388. /* ------------------------ ✕ chat posts ! ✕ ------------------------ */
  389.  
  390. .odd, .even {padding:5px;
  391. font-size:8px;
  392. padding:5px;
  393. color:{color:accent text};
  394. background-color:{color:accent};
  395. }
  396. .odd {
  397. background-color:{color:background};
  398. color:{color:accent};
  399. font-size:8px;
  400. padding:5px;
  401. }
  402. ul.chat{
  403. list-style:none;
  404. margin-left:-40px;
  405. margin-bottom:-5px;
  406. }
  407.  
  408. .chat span {
  409. float: left;
  410. }
  411.  
  412. /* ------------------------ ✕ quotations ! ✕ ------------------------ */
  413.  
  414. #ok {
  415. margin: 0 0 0.5em;
  416. border-radius: 1em;
  417. padding: 0.5em 1em;
  418. background: #eee;
  419. clear: both;
  420. position: relative;
  421. text-transform:uppercase;
  422. z-index:99999;
  423. margin-left:10px;
  424. }
  425. #ok.them {
  426. float: right;
  427. height:16px;
  428. background-color: {color:accent};
  429. color: {color:accent text};
  430. }
  431. #ok.them::after {
  432. content: "";
  433. position: absolute;
  434. right: -0.5em;
  435. bottom: 0;
  436. width: 0.5em;
  437. height: 1em;
  438. border-left: 0.5em solid {color:accent};
  439. border-bottom-left-radius: 1em
  440. }
  441. #ok.me {
  442. float: left;
  443. height:auto;
  444. background-color: {color:accent};
  445. color: {color:accent text};
  446. }
  447. #ok.me::after {
  448. content: "";
  449. position: absolute;
  450. left: -0.5em;
  451. bottom: 0;
  452. width: 0.5em;
  453. height: 1em;
  454. border-right: 0.5em solid {color:accent};
  455. border-bottom-right-radius: 1em 0.5em;
  456. }
  457.  
  458. .sourcepic {
  459. text-align:center;
  460. font-size:12px;
  461. color:{color:accent};
  462. }
  463.  
  464. .quotesource{
  465. text-align:center;
  466. font-size:8px;
  467. padding:5px;
  468. opacity:0.7;
  469. margin-bottom:10px;
  470. font-family: 'montserrat', sans serif;
  471. text-transform:lowercase;
  472. }
  473.  
  474. /* ----------------------- ✕ questions ! ✕ ------------------------ */
  475.  
  476. /* ----------------------- ✕ questions ! ✕ ------------------------ */
  477.  
  478. #asker {
  479. padding-bottom:10px;
  480. letter-spacing:2px;
  481. text-align:left;
  482. margin-top:20px;
  483. font-size:26px;
  484. margin-left:10px;
  485. font-family: 'novitha script';
  486. text-transform:lowercase;
  487. }
  488.  
  489. .answer {
  490. font-size:9px;
  491. }
  492.  
  493. .question{
  494. text-transform:uppercase;
  495. background:{color:accent};
  496. color:{color:accent text};
  497. padding:10px;
  498. border-radius:10px;
  499. font-size:8px;
  500. margin-top:-20px;
  501. }
  502.  
  503. /* ----------------------- ✕ audio bruh ! ✕ ----------------------- */
  504.  
  505. .playerbuttonbg {
  506. position: absolute;
  507. left: 20px;
  508. top: 20px;
  509. width: 19px;
  510. height: 19px;
  511. background-color: {color:posts};
  512. padding: 10px;
  513. -webkit-border-radius: 40px;
  514. -moz-border-radius: 40px;
  515. border-radius: 40px;
  516. opacity: .4;
  517. filter: alpha(opacity=40);
  518. -moz-opacity: 0.4;
  519. -khtml-opacity: 0.4;
  520. transition: opacity .7s ease-in-out;
  521. -moz-transition: opacity .7s ease-in-out;
  522. -webkit-transition: opacity .7s ease-in-out;
  523. }
  524.  
  525. .playerbuttonbg:hover {
  526. opacity: 1;
  527. filter: alpha(opacity=100);
  528. -moz-opacity: 1;
  529. -khtml-opacity: 1;
  530. }
  531.  
  532. .newplayerbutton {
  533. position: relative;
  534. width: 19px;
  535. height: 19px;
  536. overflow: hidden;
  537. }
  538.  
  539. .playerbuttonhug {
  540. position: absolute;
  541. top: -18px;
  542. left: -7px;
  543. }
  544.  
  545. .tumblr_audio_player {
  546. height: 90px;
  547. width: 270px;
  548. -moz-transform: scale(0.60, 0.60);
  549. -webkit-transform: scale(0.60, 0.60);
  550. -o-transform: scale(0.60, 0.60);
  551. -ms-transform: scale(0.60, 0.60);
  552. transform: scale(0.60, 0.60);
  553. -moz-transform-origin: top left;
  554. -webkit-transform-origin: top left;
  555. -o-transform-origin: top left;
  556. -ms-transform-origin: top left;
  557. transform-origin: top left;
  558. }
  559.  
  560. .audioimgwrapper {
  561. position: absolute;
  562. left: 0px;
  563. top: 0px;
  564. -webkit-border-radius: 40px;
  565. -moz-border-radius: 40px;
  566. border-radius: 40px;
  567. overflow: hidden;
  568. width: 79px;
  569. height: 79px;
  570. }
  571.  
  572. .audioimgwrapper img {
  573. width: 100%;
  574. height: auto;
  575. -webkit-border-radius: 40px;
  576. -moz-border-radius: 40px;
  577. border-radius: 40px;
  578. }
  579.  
  580. .trackdetails {
  581. {block:ifnot400pxposts}
  582. width: 180px;
  583. {/block:ifnot400pxposts}
  584. {block:if400pxposts}
  585. width: 280px;
  586. {/block:if400pxposts}
  587. height:auto;
  588. margin-top:8px;
  589. background:{color:wrap borders};
  590. display:inline-block;
  591. margin-left: 90px;
  592. padding:10px;
  593. margin-bottom:17px;
  594. }
  595.  
  596. .audiowrapper {
  597. position: relative;
  598. display:inline-block;
  599. }
  600.  
  601. /* ----------------------- ✕ don't do the do ✕ ----------------------- */
  602.  
  603. #yo {
  604. color: {color:accent};
  605. font-size:9px;
  606. float:right;
  607. right:0;
  608. bottom:0;
  609. margin-right:10px;
  610. height:15px;
  611. overflow:hidden;
  612. margin-bottom:20px;
  613. padding:10px;
  614. text-transform:uppercase;
  615. position:fixed;
  616. background-color:transparent;
  617. font-weight:bold;
  618. text-align:center;
  619. -webkit-transition: all .7s;
  620. -moz-transition: all .7s;
  621. -o-transition: all .7s;
  622. -ms-transition: all .7s;
  623. transition: all .7s;
  624.  
  625. }
  626.  
  627. #yo:hover{
  628. height:50px;
  629. -webkit-transition: all .7s;
  630. -moz-transition: all .7s;
  631. -o-transition: all .7s;
  632. -ms-transition: all .7s;
  633. transition: all .7s;
  634. }
  635.  
  636. /* ----------------------- ✕ description ✕ ----------------------- */
  637.  
  638. .mierdita{
  639. width:180px;
  640. height:215px;
  641. float:left;
  642. position:fixed;
  643. top:50%;
  644. left:50%;
  645. transform:translate(-50%,-50%);
  646. border-top:5px solid {color:accent};
  647. overflow:auto;
  648. text-transform:uppercase;
  649. z-index:9;
  650. font-size:8px;
  651. line-height:20px;
  652. padding:10px;
  653. text-align:justify;
  654. {block:if400pxposts}
  655. margin-left:240px;
  656. {/block:if400pxposts}
  657. {block:ifnot400pxposts}
  658. margin-left:190px;
  659. {/block:ifnot400pxposts}
  660. margin-top:72px;
  661. color:{color:desc text};
  662. background:{color:description};
  663. -webkit-transition: all .7s;
  664. -moz-transition: all .7s;
  665. -o-transition: all .7s;
  666. -ms-transition: all .7s;
  667. transition: all .7s;
  668. }
  669.  
  670. .mierdita a{
  671. color:{color:desc accent};
  672. }
  673.  
  674. .mierdita b{
  675. color:{color:desc accent};
  676. }
  677.  
  678. .mierdita i{
  679. color:{color:desc accent};
  680. }
  681.  
  682. .mierdita u{
  683. color:{color:desc accent};
  684. }
  685.  
  686. .mierdita s{
  687. color:{color:desc accent};
  688. }
  689.  
  690. /* ----------------------- ✕ post container ✕ ----------------------- */
  691.  
  692. #postcontainer {
  693. position:fixed;
  694. border-radius:7px 7px 0px 0px;
  695. top:50%;
  696. left:50%;
  697. transform:translate(-50%,-50%);
  698. z-index:9;
  699. margin-right:auto;
  700. {block:ifnot400pxposts}
  701. margin-top:25px;
  702. width: 325px;
  703. height: 310px;
  704. {/block:ifnot400pxposts}
  705. {block:if400pxposts}
  706. margin-top:30px;
  707. width:420px;
  708. height: 320px;
  709. {/block:if400pxposts}
  710. overflow-y:auto;
  711. position:fixed;
  712. margin-left:-100px;
  713. background-color:{color:background};
  714. overflow-x:hidden;
  715. margin-bottom:200px;
  716. }
  717.  
  718. /* -------------------------- ✕ blog title ✕ ----------------------- */
  719.  
  720. .moony {
  721. {block:if400pxposts}
  722. width:425px;
  723. {/block:if400pxposts}
  724. {block:ifnot400pxposts}
  725. width:325px;
  726. {/block:ifnot400pxposts}
  727. text-transform:lowercase;
  728. text-align:left;
  729. font-size:68px;
  730. font-family: 'novitha script';
  731. letter-spacing:0px;
  732. margin-top:-20px;
  733. margin-left:21px;
  734. z-index:999;
  735. margin-bottom:20px;
  736. font-weight:lighter;
  737. position:fixed;
  738. color:{color:title text};
  739. }
  740.  
  741. /* ----------------------- ✕ top bar lol ✕ ----------------------- */
  742.  
  743. .topbar {
  744. {block:ifnot400pxposts}
  745. width:320px;
  746. {/block:ifnot400pxposts}
  747. {block:if400pxposts}
  748. width:420px;
  749. {/block:if400pxposts}
  750. height:20px;
  751. position:fixed;
  752. padding-top:3px;
  753. z-index:99;
  754. margin-left:-100px;
  755. border-radius:100px 100px 100px 0px;
  756. margin-top:-148px;
  757. background-color:{color:topbar};
  758. top:50%;
  759. left:50%;
  760. transform:translate(-50%,-50%);
  761. }
  762.  
  763. /* --------------------------- ✕ icon ✕ --------------------------- */
  764.  
  765. #sbicon {
  766. {block:ifnot400pxposts}
  767. margin-left:129px;
  768. {/block:ifnot400pxposts}
  769. {block:if400pxposts}
  770. margin-left:175px;
  771. {/block:if400pxposts}
  772. position:fixed;
  773. top:50%;
  774. left:50%;
  775. transform:translate(-50%,-50%);
  776. margin-top:-100px;
  777. }
  778.  
  779. #sbicon img {
  780. width:80px;
  781. height:80px;
  782. border-radius:50%;
  783. }
  784.  
  785. /* ------------------------- ✕ sb details ✕ ----------------------- */
  786.  
  787. .petals {
  788. {block:ifnot400pxposts}
  789. margin-left:189px;
  790. {/block:ifnot400pxposts}
  791. {block:if400pxposts}
  792. margin-left:235px;
  793. {/block:if400pxposts}
  794. position:fixed;
  795. top:50%;
  796. font-size:50px;
  797. color:{color:accent};
  798. font-family:'beauty and the beast';
  799. left:50%;
  800. transform:translate(-50%,-50%);
  801. margin-top:-100px;
  802. }
  803.  
  804. #alt {
  805. {block:ifnot400pxposts}
  806. margin-left:249px;
  807. {/block:ifnot400pxposts}
  808. {block:if400pxposts}
  809. margin-left:295px;
  810. {/block:if400pxposts}
  811. position:fixed;
  812. top:50%;
  813. left:50%;
  814. transform:translate(-50%,-50%);
  815. margin-top:-105px;
  816. font-size:50px;
  817. text-align:center;
  818. width:80px;
  819. height:40px;
  820. overflow:hidden;
  821. color:{color:accent};
  822. font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
  823. text-transform:uppercase;
  824. font-size:8px;
  825. line-height:20px;
  826. }
  827.  
  828. /* ---------------- ✕ bar w quote and pagination ✕ ------------- */
  829.  
  830. .pageing{
  831. {block:ifnot400pxposts}
  832. width:310px;
  833. margin-top:195px;
  834. {/block:ifnot400pxposts}
  835. {block:if400pxposts}
  836. width:410px;
  837. margin-top:205px;
  838. {/block:if400pxposts}
  839. margin-left:-100px;
  840. z-index:9;
  841. color:{color:accent text};
  842. overflow:hidden;
  843. word-spacing:1px;
  844. height:110px;
  845. background-color:{color:topbar};
  846. font-size:10px;
  847. height:14px;
  848. letter-spacing:0.5px;
  849. padding-top:3px;
  850. padding-bottom:2px;
  851. padding-left:5px;
  852. padding-right:5px;
  853. border-radius:100px 0px 100px 100px;
  854. text-align:center;
  855. text-transform:uppercase;
  856. font-family: 'Quicksand', sans-serif;
  857. position:fixed;
  858. top:50%;
  859. left:50%;
  860. transform:translate(-50%,-50%);
  861. -webkit-transition: all .7s;
  862. -moz-transition: all .7s;
  863. -o-transition: all .7s;
  864. -ms-transition: all .7s;
  865. transition: all .7s;
  866. }
  867.  
  868. .pageing a{
  869. color:{color:accent};
  870. }
  871.  
  872. /* ------------------------- ✕ nav links ✕ ----------------------- */
  873.  
  874. #navcont {
  875. height: 320px;
  876. width:100px;
  877. background:transparent;
  878. z-index:8;
  879. position:fixed;
  880. top:50%;
  881. left:50%;
  882. transform:translate(-50%,-50%);
  883. {block:if400pxposts}
  884. margin-left:-300px;
  885. {/block:if400pxposts}
  886. {block:ifnot400pxposts}
  887. margin-left:-250px;
  888. {/block:ifnot400pxposts}
  889.  
  890. }
  891.  
  892. .remus {
  893. border-bottom:1px solid{color:accent};
  894. height:14px;
  895. padding:10px;
  896. margin-top:1px;
  897. }
  898.  
  899. .lupin {
  900. background:{color:accent};
  901. color:{color:accent text};
  902. padding:5px;
  903. font-size:12px;
  904. text-align:center;
  905. width:12px;
  906. height:12px;
  907. border-radius:50%;
  908. position:fixed;
  909. margin-top:14px;
  910. margin-left:-20px;
  911. -webkit-transition: all .7s;
  912. -moz-transition: all .7s;
  913. -o-transition: all .7s;
  914. -ms-transition: all .7s;
  915. transition: all .7s;
  916. }
  917.  
  918.  
  919. /* ------------------------ ✕ custom css ! ✕ ----------------------- */
  920. {CustomCSS}
  921. </style>
  922. </head>
  923.  
  924. <body>
  925.  
  926. <!----------------------------- sidebar ------------------------------>
  927.  
  928. <div class="topbar">
  929. <div class="moony">{title}</div>
  930. </div>
  931.  
  932. <div id="sbicon"><img src="{image:sbicon}"></div>
  933.  
  934. <div class="petals">}</div>
  935. <div id="alt">{text:alt title}</div>
  936.  
  937. <div class="mierdita">
  938. {description}
  939. </div>
  940.  
  941. <!--------------------------- navigation ---------------------------->
  942.  
  943. <div id="navcont">
  944. <div class="remus"><a href="{text:link 1}"><span class="icon-bolt lupin"></span></a></div>
  945. <div class="remus" style="margin-left:20px"><a href="{text:link 2}"><span class="icon-bubble lupin"></span></a></div>
  946. <div class="remus" style="margin-left:-10px"><a href="{text:link 3}"><span class="icon-tag lupin"></span></a></div>
  947. <div class="remus" style="margin-left:10px"><a href="{text:link 4}"><span class="icon-bulb lupin"></span></a></div>
  948. </div>
  949.  
  950. <!------------------------------- pagi -------------------------------->
  951.  
  952. <div class="pageing">
  953. <div id="pagi">
  954. <!-- Prev Page Link -->
  955. {block:PreviousPage}
  956. <a style="padding:0px;margin-top:0px;margin-left:0px;border:none;background:transparent;"href="{PreviousPage}"><span style="font-size:6px;"class="lnr lnr-chevron-left"></span></a>{/block:PreviousPage} {text:a brief quote} {block:NextPage}<a href="{NextPage}"style="padding:0px;margin-top:0px;margin-left:3px;border:none;background:transparent;"><span style="font-size:6px;" class="lnr lnr-chevron-right"></span></a> {/block:NextPage}
  957. </div>
  958.  
  959. </div>
  960.  
  961. <!------------------------------- posts -------------------------------->
  962.  
  963. <div id="postcontainer">
  964.  
  965. {block:Posts}
  966.  
  967. <article>
  968.  
  969. <div class="gryffindor">
  970.  
  971. <!-------------------------- permalink -------------------------->
  972.  
  973. <a href="{Permalink}" class="perms">
  974. {block:Date}
  975. {ShortMonth} {DayOfMonth}
  976. {/block:Date}
  977. </a>
  978.  
  979. <div style="text-align:center;display:inline;">
  980. <!--NOTES-->
  981. {block:NoteCount}
  982. <a style="color:{color:accent text}"href="{Permalink}"> <span class="lnr lnr-heart"></span> <span style="font-size:10px;font-family: 'Helvetica Neue'; font-weight: lighter;">{NoteCount}</span> </a>
  983. {/block:NoteCount}
  984. </div>
  985.  
  986. <div class="btton">
  987.  
  988. <!-------------------------- via and source -------------------------->
  989. {block:RebloggedFrom}
  990. <a href="{ReblogParentURL}"><span style="margin:5px" class="lnr lnr-map-marker"></span></a>
  991. {/block:RebloggedFrom}
  992. {block:ContentSource}<a href="{SourceURL}"><span style="margin:5px" class="icon-speech-streamline-talk-user"></span></a>
  993. {/block:ContentSource}
  994. {block:RebloggedFrom} {/block:RebloggedFrom}<a href="{ReblogURL}" target="_blank" class="details"><span class="icon-streamline-sync"></i></a>
  995. </div>
  996. </div>
  997.  
  998.  
  999. <!-------------------------- text posts -------------------------->
  1000. {block:Text}
  1001. {block:Title}
  1002. <div class="postitle">
  1003. <a href="{Permalink}">{Title}</a></div>
  1004. {/block:Title}
  1005. {Body}
  1006. {/block:Text}
  1007.  
  1008.  
  1009. <!-------------------------- photo posts -------------------------->
  1010. {block:Photo}
  1011. {block:IndexPage}
  1012. {LinkOpenTag}
  1013. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1014. {LinkCloseTag}
  1015. {/block:IndexPage}
  1016. {block:PermalinkPage}
  1017. {LinkOpenTag}
  1018. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1019. {LinkCloseTag}{/block:PermalinkPage}
  1020. {/block:Photo}
  1021.  
  1022.  
  1023. <!-------------------------- photosets -------------------------->
  1024. {block:Photoset}
  1025. {block:IndexPage}{Photoset-500}{/block:IndexPage}
  1026. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  1027. {/block:Photoset}
  1028.  
  1029.  
  1030. <!-------------------------- quote posts -------------------------->
  1031.  
  1032. {block:Source}
  1033.  
  1034. <div class="sourcepic"><span class="icon-man-people-streamline-user"></span></div>
  1035.  
  1036. <div class="quotesource">{Source}</div>
  1037. {/block:Source}
  1038.  
  1039. {block:Quote}
  1040. <div id="ok" class="me"style=>
  1041. {Quote}</div><br><br>
  1042. {/block:Quote}
  1043.  
  1044.  
  1045. <!-------------------------- link posts -------------------------->
  1046.  
  1047. {block:Link}
  1048. <div class="postitle"><a href="{URL}">{Name}</a></div>
  1049. {block:Description}{Description}{/block:Description}
  1050. {/block:Link}
  1051.  
  1052.  
  1053. <!-------------------------- chats ! -------------------------->
  1054. {block:Chat}
  1055.  
  1056. {block:Title}
  1057. <div class="postitle">
  1058. <a href="{Permalink}">{Title}</a></div>
  1059. {/block:Title}
  1060.  
  1061. <ul class="chat">
  1062. {block:Lines}<li class="{Alt}">{block:Label}<span class="label" style="text-transform:uppercase; font-weight:bold; ">{Label}</span>{/block:Label}<div style="text-transform:uppercase;">&nbsp;{Line}</div></li>{/block:Lines}
  1063. </ul>
  1064. {/block:Chat}
  1065.  
  1066.  
  1067. <!-------------------------- audio -------------------------->
  1068.  
  1069. {block:AudioPlayer}
  1070. <div class="audiowrapper">
  1071. {block:AlbumArt}
  1072. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  1073. {/block:AlbumArt}
  1074.  
  1075. <div class="playerbuttonbg">
  1076. <div class="newplayerbutton">
  1077. <div class="playerbuttonhug">
  1078.  
  1079. {AudioPlayerWhite}
  1080.  
  1081. </div>
  1082. </div>
  1083. </div>
  1084.  
  1085. <div class="trackdetails">
  1086.  
  1087. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  1088. {block:Artist}<b><i>artist:</i></b> {Artist}{/block:Artist}<br/>
  1089. {block:Album}<i><b>album:</i></b {Album}{/block:Album}<br/>
  1090. {PlayCountWithLabel}
  1091.  
  1092. </div>
  1093. </div>
  1094. {/block:AudioPlayer}
  1095.  
  1096. {block:Caption}{/block:Caption}
  1097.  
  1098.  
  1099. <!-------------------------- videos -------------------------->
  1100.  
  1101. {block:Video}
  1102. <div class="video" style="text-align:center;">{Video-250}</div>
  1103. {block:Caption}{/block:Caption}
  1104. {/block:Video}
  1105.  
  1106.  
  1107. <!-------------------------- asks -------------------------->
  1108.  
  1109. {block:Answer}
  1110.  
  1111. <div id="asker">{Asker}</div><br>
  1112.  
  1113. <div class="question">{Question}</div>
  1114.  
  1115. <div class="answer"style="margin-top:5px;position:relative">{Answer}</div>
  1116.  
  1117.  
  1118. {/block:Answer}
  1119.  
  1120. <!-------------------------- captions -------------------------->
  1121.  
  1122. {block:Caption}
  1123. {Caption}
  1124. {/block:Caption}
  1125.  
  1126. <!-------------------------- post essentials -------------------------->
  1127. <div class="postinfo">
  1128.  
  1129. {block:HasTags}
  1130. <div class="tags">
  1131. <b style="text-transform:uppercase;"><span class="lnr lnr-tag"style="font-size:12px;color:{color:posts}"></span></b>
  1132. {block:Tags}
  1133. <a href="{TagURL}"><span class="lnr lnr-chevron-right"></span> {Tag}</a>
  1134. {/block:Tags}
  1135. </div>
  1136. {/block:HasTags}
  1137.  
  1138. </div>
  1139.  
  1140. {block:PostNotes}
  1141. <div class="pagenotes">{PostNotes-16}</div>
  1142. {/block:PostNotes}
  1143.  
  1144.  
  1145.  
  1146.  
  1147. </article>
  1148. {/block:Posts}
  1149.  
  1150.  
  1151.  
  1152.  
  1153.  
  1154. </div>
  1155.  
  1156. </div>
  1157.  
  1158. <!-------------------------- dont do the do !! ------------------------->
  1159.  
  1160. <a href="http://destinatiia.tumblr.com/"target="_blank"><div id="yo"><span style="font-size:25px;"class="lnr lnr-leaf"></span><br>code by<br> becca
  1161. </div></a>
  1162. </body>
  1163.  
  1164.  
  1165. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!