Advertisement
destinatia

「 ✩ * º ╳ AWKWARD by becca. 」

Feb 21st, 2018
3,694
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.75 KB | None | 0 0
  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="#e4e4e4" />
  20. <meta name="color:posts" content="#ffffff" />
  21. <meta name="color:text" content="#000000" />
  22. <meta name="color:links" content="#000000" />
  23. <meta name="color:links hover" content="#a0a0a0" />
  24. <meta name="color:sidebar background" content="#ffffff" />
  25. <meta name="color:sidebar borders" content="#ddd" />
  26. <meta name="color:desc text" content="#ddd" />
  27. <meta name="color:desc accent" content="#ffffff" />
  28. <meta name="color:accent" content="#ddd" />
  29. <meta name="color:accent text" content="#ffffff" />
  30.  
  31. <!--------------------------- ✕ texts ✕ ------------------------------->
  32.  
  33. <meta name="text:sidebar title" content="three lines max." />
  34. <meta name="text:link 1" content="/" />
  35. <meta name="text:link 2" content="/" />
  36. <meta name="text:link 3" content="/" />
  37. <meta name="text:link 4" content="/" />
  38. <meta name="text:link 5" content="/" />
  39.  
  40. <!---------------------------- ✕ images ✕ ----------------------------->
  41.  
  42. <meta name="image:sidebar icon" content="" />
  43.  
  44. <!-------------------------- ✕ options ✕ -------------------------->
  45.  
  46. <meta name="if:300px posts" content="0"/>
  47. <meta name="if:400px posts" content="1"/>
  48. <meta name="if:500px posts" content="0"/>
  49.  
  50. <meta name="if:general links" content="0"/>
  51. <meta name="if:astronomy links" content="1"/>
  52. <meta name="if:feminine links" content="0"/>
  53. <meta name="if:spooky links" content="0"/>
  54.  
  55. <!---------------------- ✕ tooltip script ! ✕ ----------------------->
  56.  
  57.  
  58. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  59. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  60. <script>
  61. (function($){
  62. $(document).ready(function(){
  63. $("a[title]").style_my_tooltips({
  64. tip_follows_cursor:true,
  65. tip_delay_time:90,
  66. tip_fade_speed:600,
  67. attribute:"title"
  68. });
  69. });
  70. })(jQuery);
  71. </script>
  72.  
  73. <!---------------------- ✕ imported scripts ✕ ----------------------->
  74.  
  75. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  76.  
  77. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  78.  
  79. <link href="https://file.myfontastic.com/DcfqceUudTWXik9Ue2LfGV/icons.css" rel="stylesheet">
  80.  
  81. <script src="https://file.myfontastic.com/DcfqceUudTWXik9Ue2LfGV/icons.js"></script>
  82.  
  83. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  84.  
  85. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  86.  
  87. <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
  88.  
  89. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  90.  
  91. <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
  92.  
  93. <script src="https://cdn.linearicons.com/free/1.0.0/svgembedder.min.js"></script>
  94.  
  95. <link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" />
  96.  
  97.  
  98. <style type="text/css">
  99.  
  100.  
  101. /* ---------------------- ✕ imported fonts ✕ ----------------------- */
  102.  
  103. @font-face { font-family: "beauty"; src: url('https://dl.dropboxusercontent.com/s/r63d95pmyc3txmz/TamoroScript_PersonalUseOnly.ttf?dl=0'); format("truetype");}
  104.  
  105. @font-face { font-family: "frontage"; src: url('https://dl.dropboxusercontent.com/s/dcmbfprx16qqp71/Frontage-Outline.otf?dl=0'); format("truetype");}
  106. /* ------------------------ ✕ selection tool ✕ ----------------------- */
  107.  
  108. ::-moz-selection {
  109. background: {color:accent};
  110. color: {color:accent text};
  111. }
  112.  
  113. ::selection {
  114. background: {color:accent};
  115. color: {color:accent text};
  116. }
  117.  
  118. /* ------------------------ ✕ scrollbar ✕ ----------------------- */
  119. ::-webkit-scrollbar {
  120. width: 0px;
  121. visibility:none;
  122. }
  123.  
  124. ::-webkit-scrollbar-track {
  125. border-radius:50%;
  126. visibility:none;
  127. }
  128.  
  129. ::-webkit-scrollbar-thumb {
  130. background:{color:accent};
  131. visibility:none;
  132. }
  133. ::-webkit-scrollbar-thumb:window-inactive {
  134. background: transparent;
  135. }
  136.  
  137. /* ------------------------ ✕ tooltip style ✕ ----------------------- */
  138.  
  139.  
  140. #s-m-t-tooltip {
  141. max-width:300px;
  142. padding:5px;
  143. margin:10px 0px 0px 10px;
  144. background: {color:accent};
  145. font-size:7px;
  146. color:{color:accent text};
  147. letter-spacing:1px;
  148. font-family:'inconsolata', sans-serif;
  149. border-radius:0px 7px 7px 7px;
  150. z-index:999999999999999999999999999999999999;
  151. }
  152.  
  153.  
  154. /* ---------------------------- ✕ basics ✕ -------------------------- */
  155.  
  156. .tmblr-iframe.iframe-controls--desktop {
  157. top:0%!important;
  158. right:0%!important;
  159. position:fixed!important;
  160. z-index:999999999!important;
  161. /*invert the colours: */ filter:invert(100%);
  162. /*scale the buttons: */ -webkit-filter:invert(100%);
  163. transform:scale(.8, .8);
  164. -webkit-transform:scale(.8, .8);
  165. -ms-transform:scale(.8, .8);
  166. margin-top:10px;
  167. }
  168.  
  169. .tmblr-iframe--desktop-logged-in-controls {
  170. -webkit-filter:invert(100%);
  171. -moz-filter:invert(100%);
  172. -o-filter:invert(100%);
  173. -ms-filter:invert(100%);
  174. filter:invert(100%);
  175. opacity:0.3;
  176. }
  177.  
  178. body {
  179. background-color:{color:background};
  180. color: {color:text};
  181. font-family:'inconsolata';
  182. font-size: 9px;
  183. text-transform:auto;
  184. margin: 0;
  185. letter-spacing:1px;
  186. padding: 0;
  187. word-wrap: break-word;
  188. line-height:160%;
  189. background-image:url('{image:background}');
  190. }
  191.  
  192. blockquote {
  193. background:transparent;
  194. margin: 10px;
  195. padding-left:20px;
  196. border-left: 2px solid {color:accent};
  197. }
  198.  
  199. blockquote a{
  200. color:{color:accent};
  201. }
  202.  
  203. blockquote b{
  204. color:{color:accent};
  205. }
  206.  
  207. blockquote i{
  208. color:{color:accent};
  209. }
  210.  
  211. blockquote s{
  212. color:{color:accent};
  213. }
  214.  
  215. blockquote u{
  216. color:{color:accent};
  217. }
  218.  
  219. iframe, img, embed, object, video {
  220. max-width: 100%;
  221. }
  222.  
  223. p{
  224. margin-bottom:10px;
  225. }
  226.  
  227.  
  228. ul{
  229. list-style-type:circle;
  230. }
  231.  
  232. ol{
  233. list-style-type:;
  234. }
  235.  
  236. /* ------------------------ ✕ text styles ! ✕ ----------------------- */
  237.  
  238. a {
  239. color: {color:links};
  240. text-decoration: none;
  241. }
  242.  
  243. b, strong {
  244. color: {color:accent};
  245. font-family:'inconsolata';
  246.  
  247. }
  248.  
  249. i, em,italic {
  250. color: {color:accent};
  251. font-family:'inconsolata';
  252.  
  253. }
  254.  
  255. s, strike {
  256. color: {color:accent};
  257. font-family:'inconsolata';
  258.  
  259. }
  260.  
  261. u,underline {
  262. color: {color:accent};
  263. font-family:'inconsolata';
  264.  
  265. }
  266.  
  267. sup, sub, small {
  268. font-size:9px;
  269. line-height:160%;
  270. }
  271.  
  272. h3 {
  273. text-align:center;
  274. font-size:12px;
  275. line-height:100%;
  276. text-transform:uppercase;
  277. font-family:'quicksand';
  278. margin-top:20px;
  279. margin-bottom:20px;
  280. font-weight:bold;
  281. padding:5px;
  282. letter-spacing:1px;
  283. border:1px solid{color:accent};
  284. width:auto;
  285. color:{color:accent};
  286. -ms-transform: rotate(-2deg); /* IE 9 */
  287. -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
  288. transform: rotate(-2deg);
  289. }
  290.  
  291. h2 {
  292. text-align:center;
  293. font-size:12px;
  294. line-height:100%;
  295. text-transform:uppercase;
  296. font-family:'quicksand';
  297. margin-top:20px;
  298. margin-bottom:20px;
  299. font-weight:bold;
  300. padding:5px;
  301. letter-spacing:1px;
  302. border:1px solid{color:accent};
  303. width:auto;
  304. color:{color:accent};
  305. -ms-transform: rotate(-2deg); /* IE 9 */
  306. -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
  307. transform: rotate(-2deg);
  308. }
  309.  
  310. h1{
  311. text-align:center;
  312. font-size:15px;
  313. line-height:100%;
  314. text-transform:uppercase;
  315. font-family:'quicksand';
  316. margin-top:20px;
  317. margin-bottom:20px;
  318. font-weight:bold;
  319. padding:5px;
  320. letter-spacing:1px;
  321. border:1px solid{color:accent};
  322. width:auto;
  323. color:{color:accent};
  324. -ms-transform: rotate(-2deg); /* IE 9 */
  325. -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
  326. transform: rotate(-2deg);
  327. }
  328.  
  329. /* ------------------------ ✕ posts bruh ! ✕ ----------------------- */
  330.  
  331.  
  332. article {
  333. float:left;
  334. background: {color:posts};
  335. border:1px solid {color:sidebar borders};
  336. padding: 10px;
  337. letter-spacing:1px;
  338. font-weight:400;
  339. font-family:'inconsolata';
  340. {block:if300pxposts}
  341. width:300px;
  342. {/block:if300pxposts}
  343. {block:if400pxposts}
  344. width:400px;
  345. {/block:if400pxposts}
  346. {block:if500pxposts}
  347. width:500px;
  348. {/block:if500pxposts}
  349. z-index:9;
  350. color:{color:text};
  351. text-align:justify;
  352. margin-top:58px;
  353. margin-bottom:10px;
  354. border-radius:/*-top-*/0px /*-right-*/0px /*-bottom-*/7px /*-left-*/7px;
  355. }
  356.  
  357. article img{
  358. border-radius:7px;
  359. }
  360.  
  361. .vignette, #vignette {
  362. opacity:0;
  363. }
  364. .lightbox-image, #tumblr_lightbox img {
  365. box-shadow:none !important;
  366. border-radius:0 !important;
  367. max-width:none;
  368. }
  369.  
  370. .tmblr-lightbox, #tumblr_lightbox {
  371. background-color:rgba({RGBcolor:background},.80) !important;
  372. }
  373.  
  374. .lightbox-caption, #tumblr_lightbox_caption {
  375. visibility:hidden;
  376. }
  377.  
  378. .postitle {
  379. text-align:right;
  380. font-size:18px;
  381. line-height:100%;
  382. text-transform:uppercase;
  383. font-family:'frontage';
  384. margin-top:20px;
  385. margin-bottom:20px;
  386. font-weight:bold;
  387. padding:5px;
  388. letter-spacing:1px;
  389. border:1px solid{color:accent};
  390. width:auto;
  391. color:{color:accent};
  392. -ms-transform: rotate(-2deg); /* IE 9 */
  393. -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
  394. transform: rotate(-2deg);
  395. }
  396.  
  397. .postitle a{
  398. text-transform:uppercase;
  399. color:{color:accent};
  400. }
  401.  
  402. /* --------------------- ✕ permaaccent i think ! ✕ -------------------- */
  403.  
  404. .perms {
  405. font-family:'inconsolata';
  406. color:{color:title text};
  407. font-size:9px;
  408. margin-left:10px;
  409. text-transform:lowercase;
  410. }
  411.  
  412. /* ------------------------ ✕ post info ! ✕ ----------------------- */
  413.  
  414. .gryffindor{
  415. {block:if300pxposts}
  416. width:310px;
  417. {/block:if300pxposts}
  418. {block:if400pxposts}
  419. width:410px;
  420. {/block:if400pxposts}
  421. {block:if500pxposts}
  422. width:510px;
  423. {/block:if500pxposts}
  424. margin-left:-11px;
  425. margin-top:-34px;
  426. border:1px solid {color:sidebar borders};
  427. border-radius:/*-top-*/7px /*-right-*/7px /*-bottom-*/0px /*-left-*/0px;
  428. font-family: 'inconsolata', sans-serif;
  429. letter-spacing:2px;
  430. padding:5px;
  431. margin-bottom:10px;
  432. background: {color:posts};
  433. }
  434.  
  435. .gryffindor a{
  436. color:{color:accent};
  437. }
  438.  
  439. .gryffindor i{
  440. color:{color:accent};
  441. }
  442.  
  443. .hufflepuff{
  444. {block:if300pxposts}
  445. width:310px;
  446. {/block:if300pxposts}
  447. {block:if400pxposts}
  448. width:410px;
  449. {/block:if400pxposts}
  450. {block:if500pxposts}
  451. width:510px;
  452. {/block:if500pxposts}
  453. margin-left:0px;
  454. margin-top:50px;
  455. background:{color:background};
  456. font-family: 'inconsolata', sans-serif;
  457. letter-spacing:2px;
  458. padding:5px;
  459. }
  460.  
  461. .hufflepuff a{
  462. color:{color:accent};
  463. }
  464.  
  465. .hufflepuff i{
  466. color:{color:accent};
  467. }
  468.  
  469.  
  470. .slytherin{
  471. {block:if300pxposts}
  472. width:310px;
  473. {/block:if300pxposts}
  474. {block:if400pxposts}
  475. width:410px;
  476. {/block:if400pxposts}
  477. {block:if500pxposts}
  478. width:510px;
  479. {/block:if500pxposts}
  480. margin-left:-11px;
  481. text-align:right;
  482. margin-top:14px;
  483. border-top:1px solid {color:sidebar borders};
  484. font-family: 'inconsolata', sans-serif;
  485. letter-spacing:2px;
  486. padding:/*-top-*/8px /*-right-*/5px /*-bottom-*/3px /*-left-*/5px;
  487. height:10px;
  488. margin-bottom:0px;
  489. background: {color:post};
  490. }
  491.  
  492. .slytherin a{
  493. color:{color:accent};
  494. }
  495.  
  496. .slytherin i{
  497. color:{color:accent};
  498. }
  499.  
  500.  
  501. .btton{
  502. float:right;
  503. margin-right:5px;
  504. font-size:12px;
  505. margin-top:0px;
  506. letter-spacing:6px;
  507. display:table;
  508. }
  509.  
  510. .btton a{
  511. color:{color:hover title};
  512. }
  513.  
  514. .btton span {
  515. display:table-cell;
  516. vertical-align:middle;
  517. }
  518.  
  519. .postinfo{
  520. margin-top:-10px;
  521. text-align:right;
  522. font-weight:bold;
  523. padding-top:8px;
  524. }
  525.  
  526. .tags {
  527. margin-top:5px;
  528. padding:5px;
  529. font-size:9px;
  530. line-height:20px;
  531. letter-spacing:1px;
  532. font-weight:normal;
  533. -webkit-transition: all .7s;
  534. -moz-transition: all .7s;
  535. -o-transition: all .7s;
  536. -ms-transition: all .7s;
  537. transition: all .7s;
  538. }
  539.  
  540. .tags a{
  541. color:{color:accent};
  542. padding:/*-top-*/2px /*-right-*/5px /*-bottom-*/3px /*-left-*/5px;
  543. border-radius:100px;
  544. font-family: 'Inconsolata', monospace;
  545. }
  546.  
  547. .tags i{
  548. color:{color:accent};
  549. }
  550.  
  551.  
  552.  
  553. /* ---------------------- ✕ notes and shit ! ✕ ----------------------- */
  554.  
  555. ol.notes {
  556. display:block;
  557. text-align:left;
  558. list-style-type:none;
  559. margin-left:-40px;
  560. }
  561.  
  562. ol.notes li.note{
  563. margin-bottom:5px;
  564. }
  565.  
  566. .pagenotes {
  567. text-align:left;
  568. margin-top:15px;
  569. }
  570.  
  571. .pagenotes img{
  572. padding-right:5px;
  573. padding-top:5px;
  574. margin-bottom:-5px;
  575. }
  576.  
  577. /* ------------------------ ✕ post types ! ✕ ----------------------- */
  578.  
  579. /* ------------------------ ✕ chat posts ! ✕ ------------------------ */
  580.  
  581.  
  582. .odd, .even {
  583. padding:5px;
  584. height:auto;
  585. font-size:8px;
  586. letter-spacing:2px;
  587. font-family: 'Inconsolata', monospace;
  588. border-radius:10px;
  589. text-transform:uppercase;
  590. }
  591. .odd {
  592. color:{color:accent};
  593. border:1px solid {color:background};
  594. font-size:8px;
  595. padding:5px;
  596. text-align:left;
  597. width:220px;
  598. border-radius:10px 10px 10px 0px;
  599. margin-top:5px;
  600. }
  601.  
  602. .even {
  603. color:{color:accent};
  604. border:1px solid {color:background};
  605. font-size:8px;
  606. padding:5px;
  607. margin-top:5px;
  608. text-align:right;
  609. width:220px;
  610. border-radius:10px 10px 0px 10px;
  611. text-align:left;
  612. {block:if300pxposts}
  613. margin-left:70px;
  614. {/block:if300pxposts}
  615. {block:if400pxposts}
  616. margin-left:170px;
  617. {/block:if400pxposts}
  618. {block:if500pxposts}
  619. margin-left:270px;
  620. {/block:if500pxposts}
  621. }
  622.  
  623. ul.chat{
  624. list-style:none;
  625. margin-left:-40px;
  626. margin-bottom:-5px;
  627. }
  628.  
  629. .chat span {
  630. float: left;
  631. }
  632.  
  633. /* ------------------------ ✕ quotations ! ✕ ------------------------ */
  634.  
  635. .sourcepic {
  636. text-align:center;
  637. padding-right:10px;
  638. font-size:18px;
  639. padding-left:10px;
  640. display:table-cell;
  641. vertical-align:middle;
  642. color:{color:accent};
  643. }
  644.  
  645. .quotesource{
  646. text-align:center;
  647. font-size:8px;
  648. padding:5px;
  649. border-top:1px solid {color:accent};
  650. opacity:0.7;
  651. margin-bottom:10px;
  652. font-family:'inconsolata';
  653. text-transform:lowercase;
  654. }
  655.  
  656. #quoteq {
  657. vertical-align:middle;
  658. display:table;
  659. }
  660. /* ----------------------- ✕ questions ! ✕ ------------------------ */
  661.  
  662. #asker {
  663. padding-bottom:10px;
  664. letter-spacing:1px;
  665. text-align:right;
  666. margin-top:-3px;
  667. font-size:20px;
  668. margin-right:10px;
  669. margin-left:0px;
  670. z-index:999;
  671. font-weight:bold;
  672. color:{color:accent};
  673. float:right;
  674. text-shadow: 1px 0 0 {color:posts}, -1px 0 0 {color:posts}, 0 1px 0 {color:posts}, 0 -1px 0 {color:posts}, 1px 1px {color:posts}, -1px -1px 0 {color:posts}, 1px -1px 0 {color:posts}, -1px 1px 0 {color:posts};
  675. font-family: 'beauty';
  676. text-transform:lowercase;
  677. }
  678.  
  679. #asker a{
  680. color:{color:accent};
  681. }
  682.  
  683. .answer {
  684. font-size:9px;
  685. width:auto;
  686. }
  687.  
  688. .question{
  689. text-transform:none;
  690. color:{color:text};
  691. border:1px solid {color:sidebar borders};
  692. padding:10px;
  693. {block:if300pxposts}
  694. width:280px;
  695. {/block:if300pxposts}
  696. {block:if400pxposts}
  697. width:380px;
  698. {/block:if400pxposts}
  699. {block:if500pxposts}
  700. width:480px;
  701. {/block:if500pxposts}
  702. font-family: 'Inconsolata', monospace;
  703. border-radius:10px 10px 10px 0px;
  704. font-size:10px;
  705. background: transparent;
  706. margin-top:0px;
  707. }
  708.  
  709. .more-btn-wrap{
  710. position: relative;
  711. padding: 20px 0;
  712. width: 100%;
  713. }
  714.  
  715. .more-btn-wrap a:link{
  716. -webkit-transition: all 0.2s ease;
  717. -moz-transition: all 0.2s ease;
  718. -o-transition: all 0.2s ease;
  719. transition: all 0.2s ease;
  720. position: relative;
  721. left: calc(50% - 47px);
  722. padding: 7px 14px;
  723. border: 1px solid lightcoral;
  724. background: transparent;
  725. }
  726. .more-btn-wrap a:hover{
  727. background: lightcoral;
  728. color: white;
  729. }
  730.  
  731. /* ----------------------- ✕ audio bruh ! ✕ ----------------------- */
  732.  
  733. .playerbuttonbg {
  734. position: absolute;
  735. left: 20px;
  736. top: 20px;
  737. width: 19px;
  738. height: 19px;
  739. border: 1px solid {color:sidebar borders};
  740. padding: 10px;
  741. -webkit-border-radius: 40px;
  742. -moz-border-radius: 40px;
  743. border-radius: 40px;
  744. opacity: .4;
  745. filter: alpha(opacity=40);
  746. -moz-opacity: 0.4;
  747. -khtml-opacity: 0.4;
  748. transition: opacity .7s ease-in-out;
  749. -moz-transition: opacity .7s ease-in-out;
  750. -webkit-transition: opacity .7s ease-in-out;
  751. }
  752.  
  753. .playerbuttonbg:hover {
  754. opacity: 1;
  755. filter: alpha(opacity=100);
  756. -moz-opacity: 1;
  757. -khtml-opacity: 1;
  758. }
  759.  
  760. .newplayerbutton {
  761. position: relative;
  762. width: 19px;
  763. height: 19px;
  764. overflow: hidden;
  765. }
  766.  
  767. .playerbuttonhug {
  768. position: absolute;
  769. top: -18px;
  770. left: -7px;
  771. }
  772.  
  773. .tumblr_audio_player {
  774. height: 90px;
  775. width: 270px;
  776. -moz-transform: scale(0.60, 0.60);
  777. -webkit-transform: scale(0.60, 0.60);
  778. -o-transform: scale(0.60, 0.60);
  779. -ms-transform: scale(0.60, 0.60);
  780. transform: scale(0.60, 0.60);
  781. -moz-transform-origin: top left;
  782. -webkit-transform-origin: top left;
  783. -o-transform-origin: top left;
  784. -ms-transform-origin: top left;
  785. transform-origin: top left;
  786. }
  787.  
  788. .audioimgwrapper {
  789. position: absolute;
  790. left: 0px;
  791. top: 0px;
  792. -webkit-border-radius: 40px;
  793. -moz-border-radius: 40px;
  794. border-radius: 40px;
  795. overflow: hidden;
  796. width: 79px;
  797. height: 79px;
  798. }
  799.  
  800. .audioimgwrapper img {
  801. width: 100%;
  802. height: auto;
  803. -webkit-border-radius: 40px;
  804. -moz-border-radius: 40px;
  805. border-radius: 40px;
  806. }
  807.  
  808. .trackdetails {
  809. width: auto;
  810. display:inline-block;
  811. margin-left: 90px;
  812. min-height: 85px;
  813. }
  814.  
  815. .audiowrapper {
  816. position: relative;
  817. display:inline-block;
  818. }
  819.  
  820. /* ----------------------- ✕ post container ✕ ----------------------- */
  821.  
  822. #postcontainer {
  823. position:static;
  824. margin-left:40%;
  825. margin-right:auto;
  826. margin-top:100px;
  827. {block:if300pxposts}
  828. width:327px;
  829. {/block:if300pxposts}
  830. {block:if400pxposts}
  831. width:422px;
  832. {/block:if400pxposts}
  833. {block:if500pxposts}
  834. width:552px;
  835. {/block:if500pxposts}
  836. overflow-x:hidden;
  837. overflow-y:auto;
  838. text-align:center;
  839. margin-bottom:20px;
  840. }
  841.  
  842. /* ------------------------- ✕ sbar ✕ ----------------------- */
  843.  
  844.  
  845. #scott {
  846. position:fixed;
  847. -webkit-font-smoothing: subpixel-antialiased;
  848. -webkit-transform: translateZ(0) scale(1.0, 1.0);
  849. top:50%;
  850. left:40%;
  851. margin-left:-370px;
  852. margin-top:-100px;
  853. }
  854.  
  855. .narcissa {
  856. max-width:130px;
  857. max-height:60px;
  858. font-size:21px;
  859. font-weight:bold;
  860. font-family:'beauty';
  861. text-align:right;
  862. color:{color:accent};
  863. margin-top:5px;
  864. overflow:hidden;
  865. margin-left:60px;
  866. line-height:18px;
  867. z-index:9999;
  868. display:table-cell;
  869. vertical-align:middle;
  870. letter-spacing:0px;
  871. }
  872.  
  873. #sbar {
  874. width:200px;
  875. height:100px;
  876. background:{color:sidebar background};
  877. padding:/*-top-*/13px /*-right-*/2px /*-bottom-*/8px /*-left-*/3px;
  878. text-align:center;
  879. border:1px solid {color:sidebar borders};
  880. border-radius:7px;
  881. }
  882.  
  883. #sbar2 {
  884. width:200px;
  885. height:25px;
  886. background:{color:sidebar background};
  887. padding:/*-top-*/13px /*-right-*/6px /*-bottom-*/13px /*-left-*/0px;
  888. display:table-cell;
  889. vertical-align:middle;
  890. border:1px solid {color:sidebar borders};
  891. border-radius:7px;
  892. text-align:center;
  893. }
  894.  
  895. #sbaricon {
  896. margin-left:-10px;
  897. padding:10px;
  898. table-layout: fixed;
  899. display:table-cell;
  900. vertical-align:middle;
  901. }
  902.  
  903. #sbaricon img {
  904. width:60px;
  905. width:60px;
  906. border-radius:7px;
  907. }
  908.  
  909. .page {
  910. width:200px;
  911. height:25px;
  912. background:transparent;
  913. padding:/*-top-*/5px /*-right-*/0px /*-bottom-*/3px /*-left-*/0px;
  914. display:table-cell;
  915. font-family: 'Inconsolata', monospace;
  916. font-size:8px;
  917. border-top:1px solid {color:sidebar borders};
  918. vertical-align:middle;
  919. text-align:center;
  920. }
  921.  
  922. .descbox{
  923. text-transform:lowercase;
  924. z-index:9;
  925. font-size:9px;
  926. overflow-x:hidden;
  927. height:70px;
  928. overflow-y:auto;
  929. line-height:10px;
  930. text-align:center;
  931. letter-spacing:1px;
  932. font-family: 'Inconsolata', monospace;
  933. width:auto;
  934. color:{color:desc text};
  935. }
  936.  
  937. .descbox a{
  938. color:{color:desc accent};
  939. }
  940.  
  941. .descbox b{
  942. color:{color:desc accent};
  943. }
  944.  
  945. .descbox i{
  946. color:{color:desc accent};
  947. }
  948.  
  949. .descbox u{
  950. color:{color:desc accent};
  951. }
  952.  
  953. .descbox s{
  954. color:{color:desc accent};
  955. }
  956.  
  957. /* ----------------------- ✕ dropdown ✕ ----------------------- */
  958.  
  959. .lars {
  960. margin-top:0px;
  961. position:fixed;
  962. padding:0px;
  963. width:200px;
  964. margin-left:10px;
  965. color:{color:accent};
  966. background:transparent;
  967. border:{color:accent} 1px solid;
  968. text-align:left;
  969. }
  970.  
  971. .lars a{
  972. color:{color:accent text};
  973. }
  974.  
  975. .nolars {
  976. padding:10px;
  977. text-align:left;
  978. display:inline;
  979. word-spacing:4px;
  980. }
  981.  
  982. .nolars a {
  983. color:{color:accent};
  984. }
  985.  
  986.  
  987. /* ----------------------- ✕ navigation links ✕ ---------------------- */
  988.  
  989. .linkoes{
  990. margin-left:0px;
  991. margin-top:0px;
  992. font-size:15px;
  993. width: 8px;
  994. letter-spacing:1px;
  995. height: 12px;
  996. display:inline;
  997. border-radius: 5px;
  998. color:{color:sidebar borders};
  999. background:transparent;
  1000. border:{color:sidebar borders} 1px solid;
  1001. padding:/*-top-*/5px /*-right-*/5px /*-bottom-*/2px /*-left-*/6px;
  1002. text-align:left;
  1003. -webkit-transition: all .7s;
  1004. -moz-transition: all .7s;
  1005. -o-transition: all .7s;
  1006. -ms-transition: all .7s;
  1007. transition: all .7s;
  1008. }
  1009.  
  1010. /* --------------------- ✕ don't do the do ✕ --------------------- */
  1011.  
  1012. #yo {
  1013. font-size:25px;
  1014. float:right;
  1015. right:0;
  1016. bottom:0;
  1017. margin-right:10px;
  1018. padding:/*-top-*/4px /*-right-*/5px /*-bottom-*/2px /*-left-*/5px;
  1019. overflow:hidden;
  1020. margin-bottom:10px;
  1021. border-radius:/*-top-*/10px /*-right-*/10px /*-bottom-*/0px /*-left-*/10px;
  1022. text-transform:uppercase;
  1023. position:fixed;
  1024. background-color:{color:posts};
  1025. border:1px solid{color:sidebar borders};
  1026. text-align:center;
  1027. -ms-transform: rotate(0deg); /* IE 9 */
  1028. -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
  1029. transform: rotate(0deg);
  1030. -webkit-transition: all .7s;
  1031. -moz-transition: all .7s;
  1032. -o-transition: all .7s;
  1033. -ms-transition: all .7s;
  1034. transition: all .7s;
  1035.  
  1036. }
  1037.  
  1038. #yo:hover{
  1039. -ms-transform: rotate(-10deg); /* IE 9 */
  1040. -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
  1041. transform: rotate(-10deg);
  1042. -webkit-transition: all .7s;
  1043. -moz-transition: all .7s;
  1044. -o-transition: all .7s;
  1045. -ms-transition: all .7s;
  1046. transition: all .7s;
  1047. }
  1048.  
  1049. #yo a{
  1050. color:{color:accent};
  1051. }
  1052.  
  1053. /* ------------------------ ✕ custom css ! ✕ ----------------------- */
  1054. {CustomCSS}
  1055. </style>
  1056. </head>
  1057.  
  1058. <body>
  1059.  
  1060.  
  1061.  
  1062. <!------------------------------- posts -------------------------------->
  1063.  
  1064. <div id="postcontainer">
  1065.  
  1066.  
  1067. {block:Posts}
  1068.  
  1069. <article>
  1070.  
  1071. <div class="gryffindor">
  1072.  
  1073. <a href="{Permalink}" class="perms">
  1074. {block:Date}
  1075. {ShortMonth} {DayOfMonth}
  1076. {/block:Date}
  1077. </a>
  1078.  
  1079.  
  1080.  
  1081. <div class="btton">
  1082.  
  1083. <!-------------------------- via and source -------------------------->
  1084. {block:RebloggedFrom}
  1085. <span class="icon-ios-moon-outline" style="color:{color:accent}"></span> <a href="{ReblogParentURL}"class="perms" style="border-left:1px {color:background}solid;float:right;letter-spacing:1px">via {ReblogParentName}</span></a>
  1086. {/block:RebloggedFrom}
  1087.  
  1088. {block:RebloggedFrom} {/block:RebloggedFrom}
  1089. </div>
  1090. </div>
  1091.  
  1092.  
  1093. <!-------------------------- text posts -------------------------->
  1094. {block:Text}
  1095. {block:Title}
  1096. <div class="postitle">
  1097. <a href="{Permalink}">{Title}</a></div>
  1098. {/block:Title}
  1099. {Body}
  1100. {/block:Text}
  1101.  
  1102.  
  1103. <!-------------------------- photo posts -------------------------->
  1104. {block:Photo}
  1105. {block:IndexPage}
  1106. {LinkOpenTag}
  1107. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1108. {LinkCloseTag}
  1109. {/block:IndexPage}
  1110. {block:PermalinkPage}
  1111. {LinkOpenTag}
  1112. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1113. {LinkCloseTag}{/block:PermalinkPage}
  1114. {/block:Photo}
  1115.  
  1116.  
  1117. <!-------------------------- photosets -------------------------->
  1118. {block:Photoset}
  1119. <div class="pxu-photo">
  1120. <a href="#" onclick="Tumblr.Lightbox.init([/*{block:Photos}, /**/ { width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }{/block:Photos}]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  1121. {block:IndexPage}{Photoset-500}{/block:IndexPage}
  1122. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  1123. </a>
  1124. </div>
  1125. {/block:Photoset}
  1126.  
  1127.  
  1128. <!-------------------------- quote posts -------------------------->
  1129.  
  1130.  
  1131.  
  1132. <div id="quoteq">
  1133. {block:Source}
  1134. <div class="sourcepic"><span style="font-size:20px"class="icon-ios-chatbubble-outline"></span></div>
  1135. {/block:Source}
  1136.  
  1137. {block:Quote}
  1138. <div style="float:right; height:auto;font-family: 'beauty';font-size:20px;padding:10px;border-radius:0px 7px 7px 7px; color:{color:accent};font-weight:bold;">
  1139. {Quote}</div>
  1140. </div>
  1141. {/block:Quote}
  1142.  
  1143. {block:Source}
  1144. <div class="quotesource">{Source}</div>
  1145. {/block:Source}
  1146.  
  1147. <!-------------------------- link posts -------------------------->
  1148.  
  1149. {block:Link}
  1150. <div class="postitle"><a href="{URL}">{Name}</a></div>
  1151. {block:Description}{Description}{/block:Description}
  1152. {/block:Link}
  1153.  
  1154.  
  1155. <!-------------------------- chats ! -------------------------->
  1156. {block:Chat}
  1157.  
  1158. {block:Title}
  1159. <div class="postitle">
  1160. <a href="{Permalink}">{Title}</a></div>
  1161. {/block:Title}
  1162.  
  1163. <ul class="chat">
  1164. {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}
  1165. </ul>
  1166. {/block:Chat}
  1167.  
  1168.  
  1169. <!-------------------------- audio -------------------------->
  1170.  
  1171. {block:Audio}
  1172. {block:AudioPlayer}
  1173. <div class="audiowrapper">
  1174. {block:AlbumArt}
  1175. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  1176. {/block:AlbumArt}
  1177.  
  1178. <div class="playerbuttonbg">
  1179. <div class="newplayerbutton">
  1180. <div class="playerbuttonhug">
  1181.  
  1182. {AudioPlayerWhite}
  1183.  
  1184. </div>
  1185. </div>
  1186. </div>
  1187.  
  1188. <div class="trackdetails">
  1189.  
  1190. <div style="border: 1px solid {color:sidebar borders}; border-radius:7px; padding:5px; font-size:7px; color:{color:title color};">{block:TrackName}{TrackName}{/block:TrackName}</div>
  1191.  
  1192.  
  1193. <div style="border: 1px solid {color:sidebar borders};margin-top:4px; border-radius:7px; padding:5px; font-size:7px; color:{color:title color};">{block:Artist}Artist: {Artist}{/block:Artist} {block:Album}Album: {Album}{/block:Album}<br/></div>
  1194.  
  1195. <div style="border: 1px solid {color:sidebar borders}; margin-top:3px;border-radius:7px; padding:5px; font-size:7px; color:{color:title color};">{PlayCountWithLabel}<br/></div>
  1196.  
  1197.  
  1198. </div>
  1199. </div>
  1200. {/block:AudioPlayer}
  1201. {/block:Audio}
  1202.  
  1203. <!-------------------------- videos -------------------------->
  1204.  
  1205. {block:Video}
  1206. <div class="video" style="text-align:center;">{Video-250}</div>
  1207. {block:Caption}{/block:Caption}
  1208. {/block:Video}
  1209.  
  1210.  
  1211. <!-------------------------- asks -------------------------->
  1212.  
  1213. {block:Answer}
  1214.  
  1215. <div class="question">{Question}</div>
  1216.  
  1217. <div id="asker">{Asker}</div><br>
  1218.  
  1219. <div class="answer"style="margin-top:5px;position:relative">{Answer}</div>
  1220.  
  1221.  
  1222. {/block:Answer}
  1223.  
  1224.  
  1225.  
  1226. <!-------------------------- captions -------------------------->
  1227.  
  1228. {block:Caption}
  1229. {Caption}
  1230.  
  1231.  
  1232. <!-------------------------- post essentials -------------------------->
  1233.  
  1234. {/block:Caption}
  1235.  
  1236. {block:PostNotes}
  1237. <div class="pagenotes">{PostNotes-16}</div>
  1238. {/block:PostNotes}
  1239.  
  1240.  
  1241. <div class="slytherin">
  1242.  
  1243.  
  1244.  
  1245. <div style="text-align:center;display:inline;">
  1246. <!--NOTES-->
  1247. {block:NoteCount}
  1248. <a href="{Permalink}"> <span class="icon-ios-bolt-outline"></span> <span style="font-size:10px;font-family: 'inconsolata', sans-serif; font-weight: lighter;">{NoteCount}</span> </a>
  1249. {/block:NoteCount}
  1250.  
  1251. {block:ContentSource}<a href="{SourceURL}"><span style="margin:5px" class="icon-bubble-comment-streamline-talk"></span></a>
  1252. {/block:ContentSource}
  1253.  
  1254. <a href="{ReblogURL}" target="_blank" class="details"><span class="icon-arrows-ccw"></i></a>
  1255. </div>
  1256. </div>
  1257.  
  1258. </article>
  1259.  
  1260. {block:HasTags}
  1261.  
  1262. <div class="hufflepuff">
  1263. <div class="tags">
  1264. {block:Tags}
  1265. <a href="{TagURL}"></span><span style="padding-left:5px">{Tag}</span> > </a>
  1266. {/block:Tags}
  1267. </div>
  1268.  
  1269.  
  1270. </div>{/block:HasTags}
  1271.  
  1272. {/block:Posts}
  1273.  
  1274.  
  1275.  
  1276.  
  1277.  
  1278. </div>
  1279.  
  1280. </div>
  1281.  
  1282. <!----------------------------- sidebar ------------------------------>
  1283. <div id="scott">
  1284.  
  1285. <div id="sbaricon"><img src="{image:sidebar icon}"></div>
  1286.  
  1287. <div class="narcissa">{text:sidebar title}</div>
  1288.  
  1289. <div id="sbar">
  1290.  
  1291. <div class="descbox">{description}</div>
  1292.  
  1293. <div class="page">
  1294.  
  1295. {block:PreviousPage}<a style="padding:0px;margin-top:0px;margin-left:0px;border:none;background:transparent;color:{color:accent}"href="{PreviousPage}"><</a>{/block:PreviousPage} PAGE {CurrentPage} OF {TotalPages}.{block:NextPage} <a href="{NextPage}"style="padding:0px;margin-top:0px;margin-left:3px;border:none;background:transparent;color:{color:accent}">></a> {/block:NextPage}
  1296.  
  1297. </div>
  1298.  
  1299. </div>
  1300.  
  1301. <br>
  1302.  
  1303. <!------------------------------- links -------------------------------->
  1304.  
  1305. <div id="sbar2">
  1306.  
  1307. {block:ifgenerallinks}
  1308. <div class="nolars">
  1309. <div class="linkoes"><a href="{text:link 1}"><span class="icon-home-house-streamline"></span></a></div>
  1310. <div class="linkoes"><a href="{text:link 2}"><span class="icon-bubble-comment-streamline-talk"></span></a></div>
  1311. <div class="linkoes"><a href="{text:link 3}"><span class="icon-map-pin-streamline"></span></a></div>
  1312. <div class="linkoes"><a href="{text:link 4}"><span class="icon-settings-streamline-1"></span></a></div>
  1313. <div class="linkoes"><a href="{text:link 5}"><span class="icon-locker-streamline-unlock"></span></a></div></div>
  1314. {/block:ifgenerallinks}
  1315.  
  1316. {block:ifnotgenerallinks}{/block:ifnotgenerallinks}
  1317.  
  1318. {block:ifastronomylinks}
  1319. <div class="nolars">
  1320. <div class="linkoes"><a href="{text:link 1}"><span class="icon-2-earth"></span></a></div>
  1321. <div class="linkoes"><a href="{text:link 2}"><span class="icon-8-saturn"></span></a></div>
  1322. <div class="linkoes"><a href="{text:link 3}"><span class="icon-7-sun"></span></a></div>
  1323. <div class="linkoes"><a href="{text:link 4}"><span class="icon-1-venus"></span></a></div>
  1324. <div class="linkoes"><a href="{text:link 5}"><span class="icon-47-rocket"></span></a></div></div>
  1325. {/block:ifastronomylinks}
  1326.  
  1327. {block:ifnotastronomylinks}{/block:ifnotastronomylinks}
  1328.  
  1329. {block:iffemininelinks}
  1330. <div class="nolars">
  1331. <div class="linkoes"><a href="{text:link 1}"><span class="icon-glasses"></span></a></div>
  1332. <div class="linkoes"><a href="{text:link 2}"><span class="icon-rose"></span></a></div>
  1333. <div class="linkoes"><a href="{text:link 3}"><span class="icon-cosmetics"></span></a></div>
  1334. <div class="linkoes"><a href="{text:link 4}"><span class="icon-royalty-crown"></span></a></div>
  1335. <div class="linkoes"><a href="{text:link 5}"><span class="icon-spa"></span></a></div></div>
  1336. {/block:iffemininelinks}
  1337.  
  1338. {block:ifnotfemininelinks}{/block:ifnotfemininelinks}
  1339.  
  1340. {block:ifspookylinks}
  1341. <div class="nolars">
  1342. <div class="linkoes"><a href="{text:link 1}"><span class="icon-zombie-2"></span></a></div>
  1343. <div class="linkoes"><a href="{text:link 2}"><span class="icon-boo"></span></a></div>
  1344. <div class="linkoes"><a href="{text:link 3}"><span class="icon-ghost-1"></span></a></div>
  1345. <div class="linkoes"><a href="{text:link 4}"><span class="icon-spiderweb"></span></a></div>
  1346. <div class="linkoes"><a href="{text:link 5}"><span class="icon-tombstone-1"></span></a></div></div>
  1347. {/block:ifspookylinks}
  1348.  
  1349. {block:ifnotspookylinks}{/block:ifnotspookylinks}
  1350.  
  1351. </div>
  1352.  
  1353. </div>
  1354.  
  1355.  
  1356.  
  1357. <!-------------------------- dont do the do !! ------------------------->
  1358.  
  1359. <span id="yo">
  1360.  
  1361. <a href="http://desveladas.tumblr.com/"target="_blank"><span class="icon-hand-1"></span></a>
  1362. </span>
  1363. </div></a>
  1364. </body>
  1365.  
  1366.  
  1367. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement