elsaofarendelle

new hans theme 2019

Nov 1st, 2019 (edited)
311
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.96 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.  
  5.  
  6. <link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond" rel="stylesheet">
  7.  
  8. <link href="https://fonts.googleapis.com/css?family=Timmana" rel="stylesheet">
  9.  
  10. <link href="https://fonts.googleapis.com/css?family=Dancing+Script" rel="stylesheet">
  11.  
  12. <link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
  13.  
  14. <link href="https://fonts.googleapis.com/css?family=Anton" rel="stylesheet">
  15.  
  16. <link href="https://fonts.googleapis.com/css?family=Titillium+Web" rel="stylesheet">
  17.  
  18. <!--- tooltips --->
  19.  
  20. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  21. <script type="text/javascript" src="https://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  22. <script>
  23. (function($){
  24. $(document).ready(function(){
  25. $("[title]").style_my_tooltips();
  26. });
  27. })(jQuery);
  28. </script>
  29.  
  30.  
  31. </style>
  32.  
  33.  
  34. <title>{Title}</title>
  35. <link rel="shortcut icon" href="{Favicon}">
  36. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  37. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  38.  
  39.  
  40. <!-------------------------------------------
  41. Code by elsaofarendelle.
  42. Don't copy or distribute.
  43. Don't claim as your own.
  44.  
  45. C O L L A B O R A T I O N
  46.  
  47. Background by grcwingstrcng
  48. -------------------------------------------->
  49.  
  50. <meta name="image:background" content=""/>
  51. <meta name="image:sidebar" content=""/>
  52.  
  53.  
  54. <style type="text/css">
  55.  
  56. iframe#tumblr_controls {
  57. white-space:nowrap;
  58. -webkit-filter: invert(100%);
  59. -moz-filter: invert(100%);
  60. -o-filter: invert(100%);
  61. -ms-filter: invert(100%);
  62. filter: invert(100%);
  63. opacity:.2;transition: .8s ease-in-out;
  64. -webkit-transition: .8s ease-in-out;
  65. -moz-transition: .8s ease-in-out;
  66. -o-transition: .8s ease-in-out;
  67. }
  68.  
  69. /* --- CURSOR START --- */
  70.  
  71. *, body, a, a:hover {cursor: url("https://68.media.tumblr.com/tumblr_lpyq18WTCg1qcn2vb.gif"), auto;}
  72.  
  73. /* --- CURSOR END --- */
  74.  
  75. /* --- FONTS START --- */
  76.  
  77. @font-face { font-family: "starfish"; src: url('https://dl.dropboxusercontent.com/s/pmqlfb0lqbvflrn/Starfish.ttf'); format("truetype");}
  78.  
  79. @font-face { font-family: 'lumierlight'; src: url('lumierlight-webfont.woff2') format('woff2'), url('lumierlight-webfont.woff') format('woff');}
  80.  
  81.  
  82.  
  83.  
  84.  
  85. /* --- FONTS END --- */
  86.  
  87.  
  88. /* --- SCROLLBAR START ---*/
  89.  
  90. ::-webkit-scrollbar-thumb{
  91. background-color: #bcb9b8;
  92. border: none;
  93. height:auto;
  94. }
  95.  
  96. ::-webkit-scrollbar {
  97. height:auto;
  98. width:5px;
  99. background-color: transparent;
  100. border:2px solid transparent;
  101. }
  102.  
  103. /* --- SCROLLBAR END --- */
  104.  
  105.  
  106. /* --- TOOLTIPS START --- */
  107.  
  108. #s-m-t-tooltip{
  109. max-width:300px;
  110. margin:15px;
  111. padding:2px 8px;
  112. background: #e7e7e7;
  113. border: .5px solid #191919;
  114. color: #191919;
  115. border-radius:0px;
  116. z-index:9999999999999;
  117. font-size:12px;
  118. font-family: 'Luckiest Guy', cursive;
  119. font-weight:bold;
  120. text-transform:normal;
  121. box-shadow: 2px 2px 5px none;
  122. -webkit-transition:all 0.7s;
  123. -moz-transition:all 0.7s;
  124. -ms-transition:all 0.7s;
  125. -o-transition:all 0.7s;
  126. transition:all 0.7s;
  127. }
  128.  
  129. /* --- TOOLTIPS END --- */
  130.  
  131.  
  132. /* --- BODY START ---*/
  133.  
  134. body {
  135. background:#eee;
  136. background-image:url({image:background});
  137. background-attachment: fixed;
  138. background-repeat: no-repeat;
  139. background-position:0px 0px;
  140. margin:0px;
  141. color:#191919;
  142. font-family: 'Cormorant Garamond', serif;
  143. font-size:12px;
  144. line-height:120%;
  145. word-wrap: break-word;
  146. }
  147.  
  148. blockquote {
  149. padding-left:5px;
  150. border-left:2px solid;
  151. border-color: #191919;
  152. border-radius:6px;
  153. }
  154.  
  155. a {
  156. color: #191919;
  157. text-decoration:none;
  158. -webkit-transition:all 0.5s ease-in-out;
  159. -moz-transition:all 0.5s ease-in-out;
  160. -o-transition:all 0.5s ease-in-out;
  161. -ms-transition:all 0.5s ease-in-out;
  162. transition:all 0.5s ease-in-out;
  163. }
  164.  
  165.  
  166. img {none;}
  167.  
  168. h1 {
  169. font-family: 'Titillium Web', sans-serif;
  170. text-transform:none;
  171. font-size:25px;
  172. line-height:30px;
  173. letter-spacing:0px;
  174. text-align:center;
  175. font-style:normal;
  176. color: #191919;
  177. }
  178.  
  179. h2 {
  180. color: #191919;
  181. text-transform: none;
  182. letter-spacing:1px;
  183. font-family: 'Titillium Web', sans-serif;
  184. font-size:17px;
  185. line-height:30px;
  186. }
  187.  
  188. hr {
  189. border-color: #191919;
  190. border-width: .5px;
  191. }
  192.  
  193. #fixerupper {
  194. width:500px;
  195. margin:0 auto -12px auto;
  196. }
  197.  
  198. #container {
  199. width:570px;
  200. height:663px;
  201. margin-left:330px;
  202. margin-top:13px;
  203. position:fixed;
  204. overflow-y:scroll;
  205. overflow-x:hidden;
  206. padding-left:50px;
  207. padding-right:20px;
  208. padding-top:17px;
  209. padding-bottom:10px;
  210. z-index:50
  211. }
  212.  
  213. #post {
  214. background: #fff;
  215. width:500px;
  216. padding-bottom:30px;
  217. padding: 10px;
  218. text-align: justify;
  219. margin-top:10px;
  220. border: none;
  221. line-height: 100%;
  222. }
  223.  
  224.  
  225. #post img {
  226. padding: 0;
  227. max-width:100%;
  228. width: auto;
  229. height: auto;
  230. }
  231.  
  232. #post video {
  233. padding: 0;
  234. max-width:100%;
  235. width: auto;
  236. height: auto;
  237. }
  238.  
  239. pre {
  240. font-family: 'lumierlight';
  241. font-size:10px;
  242. color:#191919;
  243. letter-spacing:1px;
  244. text-align:center;
  245. text-transform:uppercase;
  246. padding:6px;
  247. background:url('');
  248. background-repeat:repeat;;
  249. }
  250.  
  251.  
  252. b {
  253. text-transform: bold;
  254. color: #000;
  255. text-shadow: 0px 0px 3px #191919;
  256. letter-spacing:1px;
  257. font-family: 'Anton', sans-serif;
  258. font-size:17px;
  259. line-height:100%;
  260. }
  261.  
  262. i {
  263. text-transform: italic;
  264. color: #000;
  265. text-shadow: 1px 1px 1px #000;
  266. text-shadow: -1px -1px -1px #000;
  267. letter-spacing:1px;
  268. font-family: 'Satisfy', cursive;
  269. font-size:20px;
  270. line-height:100%;
  271. }
  272.  
  273. sub, small, sup {
  274. font-size: 12px;
  275. }
  276.  
  277. /* --- BODY END --- */
  278.  
  279.  
  280. /* --- SIDEBAR START ---*/
  281.  
  282. #sidebar{
  283. position: fixed;
  284. top: 80px;
  285. width:150px;
  286. height:70px;
  287. left: 845px;
  288. padding:20px;
  289. }
  290.  
  291. #sidebarimage img{
  292. width: 260px;
  293. height:209px;
  294. padding:10px;
  295. border:2px none #634911;
  296. margin-top:70px;
  297. margin-left:43px;
  298. background:transparent;
  299. background-image:{image:sidebarimage};
  300. }
  301.  
  302. #nav {
  303. position:fixed;
  304. overflow:hidden;
  305. margin-top:150px;
  306. margin-left:315px;
  307. }
  308.  
  309. #link1 a , #link2 a, #link3 a
  310.  
  311. #title {
  312. font-family:times;
  313. text-align:center;
  314. width:300px;
  315. margin-top:5px;
  316. margin-left:200px;
  317. text-transform:uppercase;
  318. font-style:normal;
  319. font-size:20px;
  320. color:#fff;
  321. }
  322.  
  323. #header{
  324. width:180px;
  325. margin-left:85px;
  326. margin-top:-180px;
  327. font-style: none;
  328. font-family: 'Cormorant Garamond', serif;
  329. font-size:11px;
  330. text-transform:normal;
  331. color: #fff;
  332. letter-spacing:1px;
  333. line-height:200%;
  334. position:fixed;
  335.  
  336. }
  337.  
  338. #description {
  339. background: none;
  340. border: none;
  341. width:250px;
  342. height:130px;
  343. overflow-y:scroll;
  344. overflow-x:hidden;
  345. margin-top:120px;
  346. margin-left:-830px;
  347. padding: 12px;
  348. padding-right:10px;
  349. text-align:justify;
  350. font-style: none;
  351. font-family: 'Cormorant Garamond', serif;
  352. font-size:11px;
  353. color: #191919;
  354. text-shadow: none;
  355. letter-spacing:1px;
  356. line-height:155%;
  357. }
  358.  
  359. #pagination {
  360. font-family: 'Titillium Web', sans-serif;
  361. width:500px;
  362. font-size:15px;
  363. margin-top:-390px;
  364. margin-left:-27px;
  365. padding-left:5px;
  366. letter-spacing:3px;
  367. text-align:center;
  368. text-transform:uppercase;
  369. color:#000;
  370. }
  371.  
  372. #pagination a {
  373. color:#191919;
  374. }
  375.  
  376. /* --- SIDEBAR END ---*/
  377.  
  378.  
  379. /* --- LINKS START --- */
  380.  
  381. #links {
  382. width:150px;
  383. position:fixed;
  384. margin-left:117px;
  385. margin-top:-650px;
  386. padding:8px;
  387. }
  388.  
  389. #links a{
  390. min-width:150px;
  391. background-color: #fff;
  392. color: #191919;
  393. border:none;
  394. display:inline-block;
  395. margin:4px;
  396. font-size:9px
  397. font-family: 'lumierlight';
  398. text-align:center;
  399. text-transform:uppercase;
  400. padding-top:2px;
  401. line-height:155%;
  402. }
  403.  
  404. /* --- LINKS END --- */
  405.  
  406.  
  407. /* --- CREDIT START --- */
  408.  
  409. .credit{
  410. position:fixed;
  411. font-size:20px;
  412. right:40px;
  413. bottom:20px;
  414. z-index:51;
  415. }
  416.  
  417. .credit a {
  418. font-family: "starfish";
  419. text-decoration:none;
  420. text-transform:uppercase;
  421. color: #191919;
  422. text-shadow: -1px -1px -1px #000;
  423. text-shadow: 1px 1px 1px #000;
  424. -moz-transition-duration:.7s;
  425. -webkit-transition-duration:.7s;
  426. -o-transition-duration:.7s;
  427. }
  428.  
  429. /* --- CREDIT END --- */
  430.  
  431.  
  432. /* --- POST NOTES START --- */
  433.  
  434. .note {
  435. padding:0px 20px 0px 20px;
  436. background-color:transparent;
  437. text-transform:lowercase;
  438. letter-spacing:0px;
  439. font-size: 11px;
  440. font-style:normal;
  441. text-align:left;
  442. line-height:120%;
  443. }
  444.  
  445. .note li {
  446. list-style-type:none;
  447. padding:5px 25px 5px 25px;
  448. text-align:left;
  449. margin-right:30px;
  450. margin-top:-50px;
  451. }
  452.  
  453. #info {
  454. height:20px;
  455. text-align:center;
  456. margin-top:25px;
  457. padding-top:10px;
  458. padding:15px;
  459. padding-bottom:1px;
  460. text-transform:normal;
  461. font-style:none;
  462. font-size:12px;
  463. font-family:'Titillium Web', sans-serif;
  464. background-repeat:repeat;
  465. background-attachment:fixed;
  466. line-height:60%;
  467. background: none;
  468. border-top: 1px solid #191919;
  469. }
  470.  
  471. #info a{
  472. color: #191919;
  473. }
  474.  
  475. #tags {
  476. font-family: 'Cormorant Garamond', serif;
  477. text-align:center;
  478. margin-top:5px;
  479. padding-bottom:0px;
  480. text-transform:none;
  481. font-style:none;
  482. font-size:12px;
  483. }
  484.  
  485. #tags a {
  486. color: #191919;
  487. }
  488.  
  489. /* --- POST NOTES END --- */
  490.  
  491.  
  492. /* --- ASK & AUDIO START --- */
  493.  
  494. .ask {
  495. color: #191919;
  496. background: #fff;
  497. border: .5px solid #191919;
  498. padding:15px;
  499. margin-bottom:15px;
  500. margin-top:10px;
  501. }
  502.  
  503. .askheader {
  504. }
  505.  
  506. .asker {
  507. color: #191919;
  508. text-shadow: -1px -1px -1px #000;
  509. text-shadow: 1px 1px 1px #000;
  510. font-family: 'Titillium Web', sans-serif;
  511. font-size:22px;
  512. line-height:20px;
  513. text-align:center;
  514. padding-bottom:5px;
  515. }
  516.  
  517. .answer {
  518. color: #191919;
  519. }
  520.  
  521. .chat {
  522. list-style:none;
  523. margin-top:15px;
  524. margin-bottom:0px;
  525. font-size:10px;
  526. margin-left:0px;
  527. }
  528.  
  529. .chat ul {
  530. line-height:18px;
  531. margin-top:0px;
  532. list-style:none;
  533. padding:0px;
  534. letter-spacing:2px;
  535. font-size:10px;
  536. margin-bottom:0px;
  537. text-transform:normal;
  538. }
  539.  
  540. .person1, .person3, .person5, .person7, .person9, .person11, .person13 {
  541. background-color: none;
  542. padding:3px 8px 3px 8px;
  543. color: #191919;
  544. border-bottom: none
  545. }
  546.  
  547. .person2, .person4, .person6, .person8, .person10, .person12, .person14 {
  548. background-color: none;
  549. padding:3px 8px 3px 8px;
  550. color: #191919;
  551. border-bottom: none;
  552. }
  553.  
  554. .buttona {
  555. position: absolute;
  556. left: 30px;
  557. top: 30px;
  558. width: 19px;
  559. height: 19px;
  560. background-color: #eee;
  561. padding: 10px;
  562. opacity: .4;
  563. filter: alpha(opacity=10);
  564. -moz-opacity: 0.4;
  565. -khtml-opacity: 0.4;
  566. transition: opacity .7s ease-in-out;
  567. -moz-transition: opacity .7s ease-in-out;
  568. -webkit-transition: opacity .7s ease-in-out;
  569. }
  570.  
  571. .buttonb {
  572. position: relative;
  573. width: 19px;
  574. height: 19px;
  575. overflow: hidden;
  576. }
  577.  
  578. .buttonc {
  579. position: absolute;
  580. top: -20px;
  581. left: -20px;
  582. }
  583.  
  584. .tumblr_audio_player {
  585. height: 90px;
  586. width: 270px;
  587. -moz-transform: scale(0.60, 0.60);
  588. -webkit-transform: scale(0.60, 0.60);
  589. -o-transform: scale(0.60, 0.60);
  590. -ms-transform: scale(0.60, 0.60);
  591. transform: scale(0.60, 0.60);
  592. -moz-transform-origin: top left;
  593. -webkit-transform-origin: top left;
  594. -o-transform-origin: top left;
  595. -ms-transform-origin: top left;
  596. transform-origin: top left;
  597. }
  598.  
  599. .audioimg {
  600. position: absolute;
  601. left: 0px;
  602. top: 0px;
  603.  
  604. overflow: hidden;
  605. width: 100px;
  606. height: 100px;
  607. }
  608.  
  609. .audioimg img {
  610. width: 100%;
  611. height: auto;
  612.  
  613. }
  614.  
  615. .trackdetails {
  616. width: auto;
  617. border: 1px solid black;
  618. display:inline-block;
  619. margin-left: 120px;
  620. min-height: 85px;
  621. }
  622.  
  623. .wrapper {
  624. position: relative;
  625. display:inline-block;
  626. }
  627.  
  628. .video {
  629. width:500px!important;
  630. }
  631.  
  632. .video iframe {
  633. width:500px!important;
  634. }
  635.  
  636. /* --- ASK & AUDIO END --- */
  637.  
  638. {CustomCSS}</style></head><body>
  639.  
  640. <div id="fixerupper">
  641.  
  642. <div id="sidebar">
  643.  
  644. <div id="sidebarimage"><img src="{image:sidebar}"/></div><br>
  645.  
  646. <div class="credit">
  647. <a href="https://elsaofarendelle.tumblr.com/commission info">E</a>
  648. </div>
  649.  
  650. <div id="title"></div>
  651.  
  652. <div id="header">
  653. <center><p></p></center>
  654. </div>
  655.  
  656. <div id="description">
  657. <center>
  658. <p>"What little Hans never learned, grown up Hans will never know."</p>
  659. <p>♕ Prince Hans RP Blog from Disney's "Frozen". Founded: 30/8/2013. Independent and semi-selective. Multi-verse and Multi-ship. ♕</p>
  660. <center>
  661. </div>
  662.  
  663. <div id="links">
  664. <a href="/">refresh</a>
  665. <a href="/ask">messages</a>
  666. <a href="/rules">rules</a>
  667. <a href="/biography">biography</a>
  668. <a href="/verses">verses</a>
  669. <a href="/navigation">navigation</a>
  670. <a href="tumblr.com/dashboard">dashboard</a>
  671. </div>
  672.  
  673. <div id="scrollbar">{scrollbar}</div>
  674.  
  675.  
  676. <div id="pagination">
  677. <center> {block:Pagination}
  678. <div id="pagination">
  679. {block:PreviousPage}
  680. <a href="{PreviousPage}"><big>«</big></a>
  681. {/block:PreviousPage}
  682. {block:JumpPagination length="5"}
  683. {block:CurrentPage}
  684. <span class="current_page">{PageNumber}</span>
  685. {/block:CurrentPage}
  686. {block:JumpPage}
  687. <a class="jump_page" href="{URL}">{PageNumber}</a>
  688. {/block:JumpPage}
  689. {/block:JumpPagination}
  690. {block:NextPage}
  691. <a href="{NextPage}"><big>»</big></a>
  692. {/block:NextPage}
  693. </div>
  694. {/block:Pagination}</center>
  695. </div>
  696.  
  697. {block:HasPages}{block:Pages}
  698.  
  699. <a href="{URL}">{Label}</a>{/block:Pages}{/block:HasPages}
  700.  
  701. </div></center>
  702.  
  703.  
  704. </div>
  705.  
  706. <div id="container">{block:Posts}<div id="post">
  707.  
  708. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  709. {block:More}<p class="read-more"><a href="{Permalink}#more"><center><i>Continue Reading</i></center></a></p><a name="more"></a>{/block:More}
  710.  
  711. {block:blockquote}{/block:blockquote}
  712.  
  713. {block:ContentSource}
  714. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  715. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  716. {/block:SourceLogo}
  717. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  718. {/block:ContentSource}
  719.  
  720. {block:Photo}
  721. <center>{LinkOpenTag}<img src="{PhotoURL-highres}" width="500px" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}
  722. {/block:Photo}
  723.  
  724. {block:Photoset}
  725. <center>{Photoset}</center>{block:Caption}<i>{Caption}</i>{/block:Caption}
  726. {/block:Photoset}
  727.  
  728. {block:Quote}{Quote}{block:Source} —{Source}{/block:Source}{/block:Quote}
  729.  
  730. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  731.  
  732. {block:Chat}
  733. {block:Title}<a href="{Permalink}"><h3>{Title}</h3></a>{/block:Title}
  734. <div class="chat"><ul>{block:Lines}<li class="person{UserNumber}">{block:Label}<span class="label"><b>{Label}</b> </span>{/block:Label} {Line}</li>{/block:Lines}</ul></div>
  735. {/block:Chat}
  736.  
  737. {block:AudioPlayer}
  738. <div class="wrapper">
  739. {block:AlbumArt}
  740. <div class="audioimg"><img src="{AlbumArtURL}"></div>
  741. {/block:AlbumArt}
  742. <div class="buttona">
  743. <div class="buttonb">
  744. <div class="buttonc">
  745. {AudioPlayerGrey}
  746. </div>
  747. </div>
  748. </div>
  749. <div class="trackdetails">
  750. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  751. {block:Artist}Artist: {Artist}{/block:Artist}<br/>
  752. {block:Album}Album: {Album}{/block:Album}<br/>
  753. {PlayCountWithLabel}
  754. </div>
  755. </div>
  756. {/block:AudioPlayer}
  757. {block:Caption}{Caption}{/block:Caption}
  758.  
  759. {block:Video}<div class="video">{Video-500}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  760.  
  761. {block:Answer}
  762. <div class="askheader"><img src="" draggable="false"></div>
  763. <div class="ask"><div class="asker">{Asker}<font color=#191919> said:</font></div><p>{Question}</div><div class="answer">{Answer}</div>
  764. {/block:Answer}
  765.  
  766.  
  767. {Block:Date}<div id="info"><a href="{Permalink}" class="details" title="{TimeAgo}">posted</a> &nbsp;{block:NoteCount} <font color=#999></font> <a title="{NoteCount} notes" href="{Permalink}">notes</a> {/block:NoteCount} &nbsp; {block:RebloggedFrom} <a title="{ReblogParentName}" href="{ReblogParentURL}">source</a> {/block:RebloggedFrom}&nbsp;<a href="{ReblogURL}" target="_blank" class="details" >reblog</a> {/block:Date}</div>
  768.  
  769. <div id="tags">
  770. {block:HasTags}{block:Tags} <a href="{TagURL}">#{Tag} </a>&nbsp;{/block:Tags}{/block:HasTags}</div>
  771.  
  772. </div>
  773. {block:PostNotes}{PostNotes}{/block:PostNotes}
  774. {/block:Posts}</div>
  775.  
  776. </body>
  777.  
  778.  
  779. </html>
Advertisement
Add Comment
Please, Sign In to add comment