API tools faq
paste
bridgetowakanda

THEME 001: BLOGGER STREET by THEMESBYZORRA

bridgetowakanda
Jun 8th, 2018
464
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 34.47 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2.  
  3. <!------------------------------ FONTS ----------------------------->
  4.  
  5. <link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
  6. <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
  7. <link href="https://fonts.googleapis.com/css?family=Contrail+One" rel="stylesheet">
  8. <link href="https://fonts.googleapis.com/css?family=Rozha+One" rel="stylesheet">
  9. <link href="https://fonts.googleapis.com/css?family=Limelight" rel="stylesheet">
  10. <link href="https://fonts.googleapis.com/css?family=Anton" rel="stylesheet">
  11. <link href="https://fonts.googleapis.com/css?family=Amatic+SC" rel="stylesheet">
  12. <link href="https://fonts.googleapis.com/css?family=Orbitron" rel="stylesheet">
  13. <link href="https://fonts.googleapis.com/css?family=Peddana" rel="stylesheet">
  14.  
  15.  
  16.  
  17. <html>
  18. <!--
  19. - BASE CODE
  20. https://fratdadbase.tumblr.com/
  21.  
  22. - THEME BY ZORRA @ THEMESBYZORRA
  23. - THEME IS FREE FOR USE BY THE TUMBLR COMMUNITY. PLEASE LEAVE CREDIT WHERE IT IS DUE.
  24. - I PREFER IF YOU DIDN'T BUTURE MY CODE TO MAKE YOUR OWN BASECODE. BUT IF YOU HAPPEN TO TAKE ELEMENTS FROM THIS THEME, PLEASE CREDIT SOMEWHERE IN THE THEME.
  25. - THEME 001: BLOGGER STREET by THEMESBYZORRA
  26. -->
  27.  
  28.  
  29. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  30. <head>
  31. <title>{Title}</title>
  32. <link rel="shortcut icon" href="{Favicon}">
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34. {block:Description}
  35. <meta name="description" content="{MetaDescription}" />
  36. {/block:Description}
  37.  
  38.  
  39. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  40.  
  41. <!------------------------------ SCRIPTS ----------------------------->
  42. <!------------------------------ POPUP ------------------------------>
  43.  
  44.  
  45. <script type="text/javascript"
  46. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  47. <script>
  48. $(document).ready(function() {
  49. //
  50. $('a.poplight[href^=#]').click(function() {
  51. var popID = $(this).attr('rel'); //Get Popup Name
  52. var popURL = $(this).attr('href'); //Get Popup href to define size
  53. var query= popURL.split('?');
  54. var dim= query[1].split('&');
  55. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  56. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close">');
  57. var popMargTop = ($('#' + popID).height() + 80) / 2;
  58. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  59. //Apply Margin to Popup
  60. $('#' + popID).css({
  61. 'margin-top' : -popMargTop,
  62. 'margin-left' : -popMargLeft
  63. });
  64. $('body').append('<div id="fade"></div>');
  65. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  66. return false;
  67. });
  68. $('a.close, #fade').live('click', function() {
  69. $('#fade , .popup_block').fadeOut(function() {
  70. $('#fade, a.close').remove(); //fade them both out
  71. });
  72. return false;
  73. });
  74. });
  75. </script>
  76.  
  77.  
  78.  
  79.  
  80. <!----------------------------- TOOLTLIP ----------------------------->
  81.  
  82.  
  83. <link href="https://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  84. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  85. <script src="https://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  86. <script>
  87. (function($){
  88. $(document).ready(function(){
  89. $("[title]").style_my_tooltips({
  90. tip_follows_cursor:true,
  91. tip_delay_time:200,
  92. tip_fade_speed:500
  93. });
  94. });
  95. })(jQuery);
  96. </script>
  97.  
  98.  
  99.  
  100. <!------------------------------ TABS ------------------------------>
  101.  
  102.  
  103. <script>
  104. $(document).ready(function(){
  105. $("ul#tabs li").click(function(e){
  106. if (!$(this).hasClass("active")) {
  107. var tabNum = $(this).index();
  108. var nthChild = tabNum+1;
  109. $("ul#tabs li.active").removeClass("active");
  110. $(this).addClass("active");
  111. $("ul#tab li.active").removeClass("active");
  112. $("ul#tab li:nth-child("+nthChild+")").addClass("active");
  113. }
  114. });
  115. });
  116. </script>
  117.  
  118. <!------------------------------ VIDEO ------------------------------>
  119.  
  120. <!------ script provided by: http://shythemes.tumblr.com/post/123250129923/tutorial-resizing-videos ----->
  121.  
  122. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  123. <script>
  124. $(document).ready(function(){
  125. $('.video iframe').each(function(){
  126. var scale = $(this).parents('.video').width() / 500;
  127. $(this).attr({
  128. width: Math.floor($(this).attr('width') * scale),
  129. height: Math.floor($(this).attr('height') * scale)
  130. });
  131. });
  132. });
  133. </script>
  134. <!---------------------------- META DATA ----------------------------->
  135. <meta name="image:Background" content="" />
  136. <meta name="image:headerbackground" content=""/>
  137. <meta name="image:sidebar" content="" />
  138.  
  139. <meta name="text:Starters" content="00"/>
  140. <meta name="text:Drafts" content="00"/>
  141. <meta name="text:Memes" content="00"/>
  142. <meta name="text:Quote" content="Quote Here" />
  143.  
  144. <meta name="color:background" content="#ffffff" />
  145. <meta name="color:post" content="#ffffff" />
  146. <meta name="color:sidebox" content="#ffffff" />
  147. <meta name="color:font" conteont="#000000" />
  148. <meta name="color:italic" content="#cac8c8" />
  149. <meta name="color:bold" content="#9f9d9d" />
  150. <meta name="color:postborder" content="#b7b6b6" />
  151. <meta name="color:info" content="#cac8c8" />
  152. <meta name="color:infohover" content="#000000" />
  153. <meta name="color:blockquote" content="#000000" />
  154. <meta name="color:link" content="#222222" />
  155. <meta name="color:linkhover" content="#333333" />
  156. <meta name="color:h1" content="#ffffff" />
  157. <meta name="color:h1shadow" content="#222222" />
  158. <meta name="color:h2" content="#e7dcd6" />
  159. <meta name="color:h3" content="#111111" />
  160. <meta name="color:question" content="#e5e5e5" />
  161. <meta name="color:questionborder" content="#bbbbbb" />
  162. <meta name="color:popuplink" content="#111111" />
  163.  
  164. <meta name="select:info link background" content="#ffffff" title="white"/>
  165. <meta name="select:info link background" content="#000000" title="black"/>
  166.  
  167.  
  168. <meta name="select:header font1" content="'Rozha One', serif;" title="Rozha"/>
  169. <meta name="select:header font1" content="'Limelight', cursive;" title="Limelight"/>
  170. <meta name="select:header font1" content="'Anton', sans-serif;" title="Anton"/>
  171.  
  172. <meta name="select:header font2" content="'Rozha One', serif;" title="Rozha"/>
  173. <meta name="select:header font2" content="'Limelight', cursive;" title="Limelight"/>
  174. <meta name="select:header font2" content="'Anton', sans-serif;" title="Anton"/>
  175.  
  176.  
  177. </head>
  178.  
  179.  
  180.  
  181.  
  182.  
  183. <style type="text/css">
  184.  
  185. @font-face​ {
  186. font-family:"big noodle titling";
  187. src:url(https://dl.dropbox.com/s/j5blixn0eu397vv/big_noodle_titling.ttf');
  188. }
  189.  
  190. /*---------------------------- SCROLL BAR ---------------------------*/
  191. ::-webkit-scrollbar {
  192. width: 2px;
  193. height: 2px;
  194. }
  195. ::-webkit-scrollbar-button {
  196. width: 0px;
  197. height: 0px;
  198. }
  199. ::-webkit-scrollbar-thumb {
  200. background: transparent;
  201. border: 0px none #a68b7c;
  202. border-radius: 50px;
  203. }
  204. ::-webkit-scrollbar-thumb:hover {
  205. background: transparent;
  206. }
  207. ::-webkit-scrollbar-thumb:active {
  208. background: transparent;
  209. }
  210. ::-webkit-scrollbar-track {
  211. background: transparent;
  212. border: 0px none #a68b7c;
  213. border-radius: 0px;
  214. }
  215. ::-webkit-scrollbar-track:hover {
  216. background:transparent;
  217. }
  218. ::-webkit-scrollbar-track:active {
  219. background: transparent;
  220. }
  221. ::-webkit-scrollbar-corner {
  222. background: transparent;
  223. }
  224.  
  225.  
  226. /*---------------------------- SELECTION ---------------------------*/
  227.  
  228. ::SELECTION {BACKGROUND: {color:bold}; COLOR:#e7e5d1; }
  229. ::-MOZ-SELECTION {BACKGROUND: {color:bold}; COLOR:#e7e5d1; }
  230.  
  231.  
  232.  
  233. /*---------------------------- BODY ---------------------------*/
  234.  
  235. body {
  236. background-color:{color:background};
  237. background-image:url('{image:background}');
  238. background-attachment: fixed;
  239. background-repeat: no-repeat;
  240. font-family: 'Abel', sans-serif;
  241. font-size: 10px;
  242. text-align: justify;
  243. color: {color:font};
  244. }
  245.  
  246. #container {
  247. position:absolute;
  248. background-color: transparent;
  249. width: 460px;
  250. top: 0px;
  251. margin-top:0px;
  252. margin-left: 400px;
  253. height:100%;
  254. padding: 10px;
  255. overflow:auto;
  256. overflow-x:hidden;
  257.  
  258. }
  259.  
  260. .posts {
  261. background-color: {color:post};
  262. border: 1px solid {color:postborder};
  263. width:300px;
  264. margin-left:30px;
  265. margin-bottom:20px;
  266. padding: 13px;
  267.  
  268. }
  269.  
  270. #container img {
  271. height:auto;
  272. max-width:100%;
  273. }
  274.  
  275. #post img {
  276. height: auto;
  277. max-width: 100%;
  278. }
  279.  
  280.  
  281. /*---------------------- QUESTIONS & ANSWERS ------------------------*/
  282.  
  283. #askerurl {
  284. text-transform:uppercase;
  285. font-weight:400;
  286. font-size:20px;
  287. margin-top:80px;
  288. margin-left:50px;
  289. padding-bottom:5px;
  290. width:250px;
  291. font-family: 'Orbitron', sans-serif;
  292. text-align:center;
  293. }
  294.  
  295. #asking img {
  296. padding: 5px;
  297. }
  298.  
  299. #question {
  300. background-attachment:auto;
  301. background-image: url('');
  302. padding:15px 15px;
  303. margin:3px 0 3px 10px;
  304. border-right:5px solid {color:questionborder};
  305. border-radius: 5px;
  306. background-color:{color:question};
  307. color: {color:font};
  308. font-family: 'Open Sans Condensed';
  309. -webkit-border-radius: 10px;
  310. }
  311.  
  312. #answer {
  313. word-spacing: 0px;
  314. }
  315.  
  316.  
  317. /*---------------------------- NAVIGATION ---------------------------*/
  318.  
  319. .links {
  320. top: 620px;
  321. left: 200px;
  322. position: fixed;
  323. width: auto
  324. height: auto;
  325. text-align: center;
  326. }
  327.  
  328.  
  329.  
  330. /*---------------------------- SIDEBOXS ---------------------------*/
  331.  
  332. .title {
  333. position: fixed;
  334. background-color: {color:sidebox};
  335. padding: 5px;
  336. top: 250px;
  337. left: 200px;
  338. width: 200px;
  339. height: 50px;
  340. }
  341.  
  342. .sidebar {
  343. position: fixed;
  344. background-color: {color:sidebox};
  345. padding: 0px;
  346. top: 300px;
  347. left: 200px;
  348. width: 200px;
  349. height: 100px;
  350. padding: 5px;
  351.  
  352. }
  353.  
  354. .sidebox {
  355. position: fixed;
  356. background-color: {color:sidebox};
  357. border-bottom: 1px solid {color:postborder};
  358. top: 400px;
  359. left: 200px;
  360. width: 200px;
  361. height: 200px;
  362. overflow: auto;
  363. padding: 5px;
  364. z-index: 1;
  365. }
  366.  
  367.  
  368. /*---------------------------- CREDIT ---------------------------*/
  369.  
  370. .credit {
  371. left: 98%;
  372. top: 95%;
  373. width: 50px;
  374. height: 50px;
  375. position: fixed;
  376. }
  377.  
  378. a.credit, a.credit:link, a.credit:active, a.credit:visited{
  379. text-decoration: none;
  380. color: #8f3d2e;
  381. text-transform: none;
  382. font-family: 'Contrail One', cursive;
  383. font-size: 14px;
  384. -moz-transition-duration:.6s;
  385. -webkit-transition-duration:.6s;
  386. -o-transition-duration:.6s;
  387. -webkit-filter: blur(0px);
  388.  
  389. }
  390.  
  391. a.credit:hovor {
  392. color: #8f8f8f;
  393. font-family: 'Contrail One', cursive;
  394. letter-spacing: 0px;
  395. -moz-transition-duration:.6s;
  396. -webkit-transition-duration:.6s;
  397. -o-transition-duration:.6s;
  398. -webkit-filter: blur(0px); }
  399.  
  400.  
  401.  
  402. /*---------------------------- FANCY FONT ---------------------------*/
  403.  
  404. h1 {
  405. font-size:30px;
  406. font-family: {select:header font1};
  407. font-weight:400;
  408. color:{color:h1};
  409. border-bottom: 1px solid {color:h1};
  410. text-shadow: 1px 1px 1px {color:h1shadow};
  411. display:block;
  412. margin-top: 20px;
  413. text-align:right;
  414. text-transform:uppercase;
  415. padding:10px;
  416. letter-spacing:3px;
  417.  
  418. }
  419.  
  420. h2 {
  421. font-size:12px
  422. font-family: {select:header font2};
  423. font-weight:400;
  424. color:{color:h2};
  425. text-align: center;
  426. text-transform:lowercase;
  427. letter-spacing:2px;
  428. display:block;
  429. margin:0, 0, 5px, 0;
  430. padding:5px;
  431. }
  432.  
  433.  
  434. h3 {
  435. background-image: url('{image:headerbackground}');
  436. background-repeat:repeat;
  437. background-attachment:fixed;
  438. border: double 3px #000;
  439. padding:10px;
  440. color:#ffffff;
  441. text-shadow:1px 1px 2px #000,
  442. font-size:15px;
  443. font-family:calibri;
  444. text-transform:uppercase;
  445. letter-spacing:1px;
  446. text-align:center;
  447. overflow:auto;
  448.  
  449. }
  450.  
  451.  
  452.  
  453. i, italic, em {
  454. font-family: 'Peddana', serif;
  455. font-size: 15px;
  456. text-transform: italic;
  457. color:{color:italic};
  458. text-transform:lowercase;
  459. letter-spacing:1px;
  460. text-shadow: 1px 1px #000;
  461.  
  462. }
  463.  
  464. b, bold, strong {
  465. font-size:10px;
  466. font-family: 'Orbitron', sans-serif;
  467. color:{color:bold};
  468. text-transform:lowercase;
  469.  
  470. }
  471. u, underline {font:8px 'Fjalla One'; font-weight:400; color:#79b4a8; text-transform:uppercase; letter-spacing:1px;}
  472.  
  473. p {
  474. margin-top:5px;
  475. margin-bottom:5px;}
  476.  
  477.  
  478. ol {
  479. list-style:normal;}
  480.  
  481.  
  482. ul {
  483. list-style:square;}
  484.  
  485.  
  486. small {
  487. font-size:10px}
  488.  
  489.  
  490. sup,sub {
  491. font-size:11px}
  492.  
  493.  
  494.  
  495. blockquote {
  496. padding:2px 7px;
  497. padding-right:17px;
  498. margin:3px 0 3px 10px;
  499. border-left:1px solid {color:blockquote};
  500. -webkit-border-radius: 10px;
  501. }
  502.  
  503.  
  504. blockquote img{
  505. max-width:100%;
  506. height:auto;
  507. }
  508.  
  509. blockquote blockquote img{
  510. max-width:100%;
  511. height:auto;
  512. }
  513.  
  514.  
  515.  
  516.  
  517. t, title {
  518. size: 15px;
  519. color: 222;
  520. letter-spacing: 2px;
  521. font: times;
  522. }
  523.  
  524. quotetext {
  525. font-family: times;
  526. font-size: 20px;
  527. line-height: 21px;
  528. letter-spacing: 2px;
  529. text-align: center;
  530. text-transform:uppercase;
  531. color: #fff;
  532. text-shadow: 3px 1px 1px #79b4a8;
  533. }
  534.  
  535. quotations {
  536. font: courier;
  537. font-size: 30px;
  538. color: {color:bold};
  539. }
  540.  
  541. quote {
  542. font-size: 13px;
  543. }
  544.  
  545. img {
  546. max-width:100%;
  547. }
  548.  
  549. hr {
  550. width:100px;
  551. border: 0;
  552. height: 0.5px;
  553. margin-right:10px;
  554. background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 255), rgba(255, 255, 255, 0));
  555. }
  556.  
  557.  
  558. /*---------------------------- LINKS ---------------------------*/
  559.  
  560. a:link, a:active, a:visited {
  561. text-decoration: none;
  562. color: {color:link};
  563. text-transform: none;
  564. font-family: 'Contrail One', cursive;
  565. font-size: 14px;
  566. -moz-transition-duration:.6s;
  567. -webkit-transition-duration:.6s;
  568. -o-transition-duration:.6s;
  569. -webkit-filter: blur(0px);}
  570.  
  571. a:hover {
  572. color: {color:linkhover};
  573. font-family: 'Contrail One', cursive;
  574. letter-spacing: 0px;
  575. -moz-transition-duration:.6s;
  576. -webkit-transition-duration:.6s;
  577. -o-transition-duration:.6s;
  578. -webkit-filter: blur(0px);}
  579.  
  580.  
  581.  
  582. a.navi, a.navi:link, a.navi:active, a.navi:visited {
  583. color: #a68b7c;
  584. text-shadow: 0px 0px 10px #a68b7c;
  585. font-family: times;
  586. font-size: 12px;
  587.  
  588. }
  589.  
  590. a.navi:hover {
  591. -moz-transition-duration:.6s;
  592. -webkit-transition-duration:.6s;
  593. -o-transition-duration:.6s;
  594. -webkit-filter: blur(0px);
  595. }
  596.  
  597.  
  598. .me {
  599. padding-top:5px;
  600. text-align:center; }
  601.  
  602.  
  603. .me a {
  604. display:inline-block;
  605. width:90px; height:4px;
  606. margin:2px; padding:3px 6px 10px;
  607. text-align:center;
  608. background-image: url('');
  609. background:transparent;
  610. background-repeat:repeat;
  611. background-attachment:fixed;
  612. color:{color:link};
  613. font-size:9px;
  614. font-family:calibri;
  615. text-shadow:1px 1px 0px {select:info link background};
  616. display: inline-block;
  617. cursor: pointer;
  618. }
  619.  
  620. .me a:hover {
  621. display:inline-block;
  622. letter-spacing:2px;
  623. -moz-transition-duration: 0.4s;
  624. -webkit-transition-duration: 0.4s;
  625. -o-transition-duration: 0.4s;
  626. transition-duration: 0.4s;
  627. }
  628.  
  629. /*---------------------------- PAGINATION ---------------------------*/
  630.  
  631.  
  632. .pagination {
  633. position:fixed;
  634. top: 615px;
  635. left: 345px;
  636. height: 100px;
  637. width: 100px;
  638. text-align:center;
  639. }
  640.  
  641.  
  642.  
  643.  
  644. /*------------------------ POST INFO & TAGS -------------------------*/
  645.  
  646.  
  647.  
  648. #infobox {
  649. border:1px solid transparent;
  650. margin-bottom:0px;
  651. padding-top:10px;
  652. }
  653.  
  654.  
  655. #info {
  656. margin-left:20px;
  657. padding-bottom: 2px;
  658. }
  659.  
  660. #info a {
  661. color:{color:info};
  662. text-shadow: 1px 1px {select:info link background};
  663. opacity: 1;
  664. font-family: 'big noodle titling';
  665. text-transform: uppercase;
  666. }
  667.  
  668. #info a:hover {
  669. color:{color:infohover};
  670. opacity: 1;
  671. }
  672.  
  673.  
  674.  
  675. #tags {
  676. width:250px;
  677. height: 25px;
  678. font-size:7px;
  679. text-align:right;
  680. font-family:arial;
  681. text-transform:uppercase;
  682. background:transparent;
  683. border-bottom:1px solid {color:postborder};
  684. overflow: auto;
  685. margin-top:10px;
  686. margin-left:15px;
  687. max-height:45px;
  688. margin-bottom: -50px;
  689. }
  690.  
  691.  
  692. #tags a {
  693. font-family:consolas;
  694. font-size:8px;
  695. line-height:8pt;
  696. letter-spacing:0px;
  697. color:{color:bold};
  698. text-decoration:none;
  699. text-shadow: 0px 0px {select:info link background};
  700. text-transform:uppercase;
  701. letter-spacing:0px;
  702. text-align:center;
  703. display:inline-block;
  704. }
  705.  
  706.  
  707. #tags a:hover {
  708. color:{color:bold};
  709. filter: blur(0px);
  710. -webkit-transition: all 0.6s ease-in-out;
  711. -moz-transition: all 0.6s ease-in-out;
  712. -o-transition: all 0.6s ease-in-out;
  713. -ms-transition: all 0.6s ease-in-out;
  714. transition: all 0.6s ease-in-out;
  715. }
  716.  
  717.  
  718.  
  719.  
  720.  
  721.  
  722. /*---------------------------- EXTRA 1 ---------------------------*/
  723.  
  724.  
  725.  
  726. .notecontainer {
  727. background-color: transparent;
  728. border: 0px solid transparent;
  729. width:280px;
  730. padding: 0px;
  731. text-transform:uppercase;
  732. font-style:normal;
  733. font-size: 10px;
  734. height: 150px;
  735. overflow: auto;
  736. margin-left: 50px;
  737. text-align:left;
  738.  
  739. }
  740. .note {
  741. background-color: transparent;
  742. border: 1px solid transparent;
  743. width:280px;
  744. padding: 0px;
  745. text-transform:uppercase;
  746. font-style:normal;
  747. font-size: 10px;
  748. height: auto;
  749. overflow: auto;
  750. margin-left: -25px;
  751. text-align:left;
  752.  
  753. }
  754.  
  755. .note li {
  756. list-style-type:none;
  757. padding: 10px;
  758. text-align:left;
  759. margin:0px;
  760. -moz-transition-duration:0.5s;
  761. -webkit-transition-duration:0.5s;
  762. -o-transition-duration:0.5s;}
  763.  
  764. .note img.avatar {
  765. margin-right: 10px;
  766. width: 25px;
  767. height: 25px;}
  768.  
  769.  
  770.  
  771.  
  772. /*-------------------------- MUSIC PLAYER ---------------------------*/
  773.  
  774.  
  775.  
  776. .songart{
  777. float:left;
  778. margin-right:10px;
  779. }
  780.  
  781. .songart img{
  782. width:80px;
  783. height:80px;
  784. }
  785.  
  786. .songtitle{
  787. margin-bottom:10px;
  788. margin-left:90px;
  789. }
  790.  
  791. .songauthor{
  792. margin-bottom:10px;
  793. font-size:8px;
  794. margin-left:90px;
  795. }
  796.  
  797. .tumblr_audio_player {
  798. height: 50px;
  799. }
  800.  
  801.  
  802.  
  803. /*---------------------------- TOOLTIP ---------------------------*/
  804.  
  805.  
  806.  
  807. #s-m-t-tooltip{
  808. max-width:400px;
  809. margin:15px;
  810. padding:2px 8px;
  811. background: #1c0915;
  812. background-image:url('{image:headerbackground}');
  813. background-repeat:repeat;
  814. background-attachment:fixed;
  815. border: double 3px #000;
  816. color:#fff;
  817. text-shadow:1px 1px 0px #000,
  818. z-index:99999999999999999999;
  819. font-size:9px;
  820. letter-spacing:2px;
  821. font-style:bold;
  822. letter-spacing:2px;
  823. font-family: calibri;
  824. text-transform:uppercase;
  825. box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  826.  
  827.  
  828.  
  829. /*--------------------------- POPUP ------------------------------ */
  830.  
  831.  
  832. /*--Making IE6 Understand Fixed Positioning--*/
  833. *html #fade {
  834. position: absolute;
  835. }
  836. *html .popup_block {
  837. position: absolute;
  838. }
  839.  
  840. .popup_block{
  841. background-color: {color:background};
  842. border: 1px solid {color:postborder};
  843. width:330px;
  844. height:100%;
  845. top:400px;
  846. padding: 10px;
  847. left: 650px;
  848. display: none; /*--hidden by default--*/
  849. float: left;
  850. font-size: 10px; /*font size of the words inside the box */
  851. position: fixed;
  852. z-index: 99999; /*if the box is hiding behind other things in your theme, add more 9′s */
  853. }
  854.  
  855.  
  856. #fade { /*--Transparent background layer--*/
  857. display: none; /*--hidden by default--*/
  858. background: transparent;
  859. background-image: url('{image:popup}'); /*if you want to add a background image to go behind your popup */
  860. position: fixed; left: 0; top: 0;
  861. width: 100%; height: 100%;
  862. opacity: 1.0;
  863. z-index: 9999;
  864. }
  865.  
  866. .popupnavlinks {
  867. padding-top:5px;
  868. text-align:center; }
  869.  
  870.  
  871. .popupnavlinks a {
  872. display:inline-block;
  873. width:90px; height:4px;
  874. margin:2px; padding:3px 6px 10px;
  875. text-align:center;
  876. background-image: url('');
  877. background:transparent;
  878. background-repeat:repeat;
  879. background-attachment:fixed;
  880. border: solid 1px {color:popuplink};
  881. color:{color:popuplink};
  882. font-size:9px;
  883. font-family:calibri;
  884. text-shadow:1px 1px 0px #fff,
  885. display: inline-block;
  886. cursor: pointer;
  887. }
  888.  
  889. .popupnavlinks a:hover {
  890. display:inline-block;
  891. letter-spacing:2px;
  892. -moz-transition-duration: 0.4s;
  893. -webkit-transition-duration: 0.4s;
  894. -o-transition-duration: 0.4s;
  895. transition-duration: 0.4s;
  896. }
  897.  
  898.  
  899.  
  900. .popupclose {
  901. float:right; top:0px; right:0px;
  902. margin-top:-10px; margin-right:-10px;
  903. font-family:'Scada', sans serif;
  904. font-size:10px;
  905. font-weight:bold }
  906.  
  907. .popupclose a {
  908. color:#aaa }
  909.  
  910.  
  911.  
  912. /*----------------------------- TABS ------------------------------- */
  913.  
  914. ul#tabs {
  915. list-style-type: none;
  916. padding: 0;
  917. text-align: justify;
  918. font-size:8px;
  919. letter-spacing:1px;
  920. }
  921. ul#tabs li {
  922. background-color: transparent;
  923. border: 0px solid {color:postborder};
  924. border-radius: 2px;
  925. background-repeat:repeat;
  926. background-attachment:fixed;
  927. background-image: url('');
  928. display: inline-block;
  929. padding: 4px 10px;
  930. margin-bottom: 4px;
  931. margin-left: 2px;
  932. cursor: pointer;
  933. color: {color:italic};
  934. text-align: center;
  935. }
  936. ul#tabs li:hover {
  937. background-color: transparent;
  938. border-radius: 2px;
  939. color: {color:linkhover};
  940. text-shadow: 1px 1px 3px #111;
  941. }
  942. ul#tabs li.active {
  943. background-image: url('');
  944. background:transparent;
  945. background-repeat:repeat;
  946. background-attachment:fixed;
  947. border: 0px solid {color:postborder};
  948. color:{color:bold};
  949. display: inline-block;
  950. padding: 4px 10px;
  951. margin-bottom: 4px;
  952. cursor: pointer;
  953. border-radius: 2px;
  954. text-align: center;
  955. }
  956. ul#tab {
  957. list-style-type: none;
  958. margin: 0;
  959. padding: 0;
  960. }
  961. ul#tab li {
  962. display: none;
  963. }
  964. ul#tab li.active {
  965. display: block;
  966. }
  967.  
  968.  
  969. .esperanza {
  970. position: fixed;
  971. background-color: {color:background};
  972. border: 0px solid {color:postborder};
  973. padding: 5px;
  974. top: 0px;
  975. left: 450px;
  976. width: 320px;
  977. height: 15px;
  978. overflow: auto;
  979. z-index: 999999999999;
  980.  
  981. }
  982.  
  983. /* ----------------------------- CHAT CODE --------------------------- */
  984.  
  985. /* chat cred: http://dear-indies.tumblr.com/post/125257866576/animalites-imessage-chat-post-ive-seen-a-lot */
  986.  
  987. /* IMESSAGE CHAT POST */
  988. .answer span,.convo li{margin:0 0 5px;border-radius:1em;padding:.5em 10px;max-width:75%;clear:both;position:relative}.answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{float:left;background:#e5e5ea;color:#000;left:3px}.me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid #e5e5ea;border-bottom-right-radius:1em .5em}.answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{right:3px;float:right;background-color:#e8f3f9;color:#000}.them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{content:"";position:absolute;right:-.5em;bottom:0;width:.5em;height:1em;border-left:.5em solid #e8f3f9;border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}
  989. .asked p {
  990. text-align: left;
  991. margin: 0 0px 10px 0px;
  992. padding: 0;
  993. color: #666666;
  994. font-family: 'Inconsolata', Inconsolata;
  995. font-size: 12px;
  996. line-height: 0px;
  997. }
  998. .footerright .viasrc {
  999. float: left;
  1000. }
  1001. .asked a {
  1002. margin:0;padding:0;
  1003. }
  1004. .user_4{background-color:#55caff;color:#fff}.user_4::after{border-color:#55caff}.user_6{background-color:#60f246;color:#fff}.user_6::after{border-color:#60f246}.user_5{background-color:#9ff3fc;color:#000}.user_5::after{border-color:#9ff3fc}.user_3{background-color:#25c413;color:#fff}.user_3::after{border-color:#25c413}.user_7{background-color:#9b9b9b;color:#fff}.user_7::after{border-color:#9b9b9b}.user_8{background-color:#0d9321;color:#fff}.user_8::after{border-color:#0d9321}.user_9{background-color:#606060;color:#fff}.user_9::after{border-color:#606060}
  1005. .convo {
  1006. overflow: hidden;
  1007. list-style-type: none;
  1008. padding: 0;
  1009. margin: 0;
  1010. }
  1011.  
  1012.  
  1013. </style>
  1014.  
  1015.  
  1016.  
  1017. <body>
  1018.  
  1019. <!--------------------------- SIDEBOX -------------------------------->
  1020.  
  1021. <div class="title">
  1022. <h2>CHARACTER NAME HERE</h2>
  1023. </div>
  1024. <div class="sidebar">
  1025. <img src="{image:sidebar}">
  1026. </div>
  1027.  
  1028.  
  1029. <div class="sidebox">
  1030.  
  1031. <h2>ALISES OR SOMETHING HERE</h2>
  1032. <center><b>MAYBE A QUOTE HERE</b></center>
  1033.  
  1034.  
  1035. <p>
  1036. <p>
  1037. <h3>DEBTS</h3>
  1038. <center>
  1039. <b>Starters:</b> {text:Starters} <br> <b>Drafts:</b> {text:Drafts} <br> <b>Memes:</b> {text:Memes}
  1040. </center>
  1041.  
  1042.  
  1043. <br>
  1044. <h3>Pennd By</h3>
  1045.  
  1046. <center>
  1047. <i>PENNAME HERE</i>
  1048.  
  1049. </center>
  1050. </div>
  1051.  
  1052.  
  1053.  
  1054. <!---------------------------- POP UP PAGES -------------------------->
  1055. <!------------------------------ RULES HERE -------------------------->
  1056. <div id="box2" class="popup_block">
  1057.  
  1058. <div style="width:330px;height:auto;overflow:auto; margin-top:200px;">
  1059.  
  1060.  
  1061. <div class="esperanza">
  1062. <ul id="tabs">
  1063. <center>
  1064. <li class="active">RULES</li>
  1065. <li>ABOUT</li>
  1066. <li>NAVIGATION</li>
  1067. <li>M & E</li>
  1068. <li>EXTRA</li>
  1069. </center>
  1070. </ul>
  1071. </div>
  1072.  
  1073. <ul id="tab">
  1074.  
  1075. <li class="active">
  1076.  
  1077. <H1>RULES HERE</H1>
  1078.  
  1079. </li>
  1080. <!-------------------------------- RULES END ------------------------->
  1081.  
  1082. <!------------------------------ ABOUT HERE ------------------------>
  1083. <li>
  1084.  
  1085. <h2>The Basics</h2>
  1086. <p><strong>FULL NAME:</strong> INPUT <br />
  1087. <strong>RANK:</strong> INPUT<br />
  1088. <strong>DOB:</strong> INPUT<br />
  1089. <strong>POB:</strong> INPUT<br />
  1090. <strong>HOME TOWN:</strong> INPUT<br />
  1091. <strong>SEX:</strong> INPUT<br />
  1092. <strong>ORIENTATION:</strong> INPUT<br />
  1093. <strong>MARITAL STATUS:</strong> INPUT<br />
  1094. <strong>KNOWN LANGUAGES:</strong> INPUT<br />
  1095. <strong>EDUCATION:</strong> INPUT<br />
  1096. <strong>CURRENT OCCUPATION:</strong> INPUT<br />
  1097. <strong>PREVIOUS LOCATIONS:</strong> INPUT</p>
  1098. <h2>Family</h2>
  1099. <p><strong>MOTHER:</strong> INPUT<br />
  1100. <strong>FATHER:</strong> INPUT<br />
  1101. <strong>BROTHER:</strong> INPUT<br />
  1102. <strong>SISTER:</strong> INPUT</p>
  1103. <h2>Traits</h2>
  1104. <p><strong>HAIR / EYES:</strong> INPUT<br />
  1105. <strong>HEIGHT / WEIGHT:</strong> INPUT<br />
  1106. <strong>BODY TYPE / SKINTONE:</strong> INPUT<br />
  1107. <strong>NOTABLE MARKINGS:</strong> INPUT<br />
  1108. <strong>FACE CLAIMS:</strong>INPU</p>
  1109.  
  1110. <br>
  1111. <p>
  1112. <h2>ABOUT YOUR CHARACTER HERE</h2>
  1113. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget convallis lacus. Nullam cursus neque id vestibulum feugiat. Praesent id dictum est, a tempor nisl. Nam rhoncus tempor mauris, quis consequat lectus accumsan eget. Ut faucibus orci vitae tortor tincidunt, at rutrum erat posuere. Maecenas rhoncus elit ac gravida fringilla. Aliquam erat volutpat. Sed et lacinia sem. Vivamus id justo ut elit facilisis ullamcorper. Integer quis purus eu velit convallis accumsan. Fusce a metus ipsum. Phasellus elementum augue leo, condimentum dictum orci laoreet sit amet.
  1114.  
  1115. <p>Nullam maximus ultricies massa, sed commodo leo interdum sit amet. Quisque faucibus dolor diam, vel euismod metus consectetur et. Vivamus posuere, dolor quis ullamcorper molestie, magna ante feugiat lacus, nec rhoncus dui velit ut felis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras et lacus rutrum, congue lacus nec, aliquet est. Ut varius urna in ex sodales facilisis. Vestibulum sit amet rutrum eros, efficitur facilisis eros. Phasellus scelerisque, nisi at fringilla consequat, lorem tortor molestie libero, in varius urna lectus non quam. Duis viverra eros elit, feugiat venenatis dui maximus vitae. Nunc id tellus ut leo viverra blandit hendrerit in magna. Ut ac nisi id dui interdum vestibulum id quis velit. Maecenas molestie hendrerit elit id condimentum.
  1116.  
  1117.  
  1118. </li>
  1119. <!------------------------------ ABOUT END ------------------------>
  1120. <!--------------------------- NAVIGATION HERE ------------------------>
  1121. <li>
  1122. <h2>ATLAS</h2>
  1123. <center>
  1124.  
  1125. <h1>NAVIGATION</h1>
  1126.  
  1127.  
  1128. <div class="popupnavlinks">
  1129. <a href="/tagged/whatever">LINK</a>
  1130. <a href="/tagged/whatever">LINK</a>
  1131. <br>
  1132. <a href="/tagged/whatever">LINK</a>
  1133. <a href="/tagged/whatever">LINK</a>
  1134. <br>
  1135. <a href="/tagged/whatever">LINK</a>
  1136. <a href="/tagged/whatever">LINK</a>
  1137. <br>
  1138. <a href="/tagged/whatever">LINK</a>
  1139. <a href="/tagged/whatever">LINK</a>
  1140. <br>
  1141. <a href="/tagged/whatever">LINK</a>
  1142. <a href="/tagged/whatever">LINK</a>
  1143. <br>
  1144. <a href="/tagged/whatever">LINK</a>
  1145. <a href="/tagged/whatever">LINK</a>
  1146. <br>
  1147. <a href="/tagged/whatever">LINK</a>
  1148. <a href="/tagged/whatever">LINK</a>
  1149. <br>
  1150. </div>
  1151. </li>
  1152. <!--------------------------- NAVIGATION END ------------------------>
  1153. <!------------------------- MAINS & EXCLUSIVES? ---------------------->
  1154. <li>
  1155. <h2>MAINS AND EXCLUSIVES</h2>
  1156.  
  1157. <div class="me">
  1158. <a href="/tagged/whatever">LINK</a>
  1159. <a href="/tagged/whatever">LINK</a>
  1160. <br>
  1161. <a href="/tagged/whatever">LINK</a>
  1162. <a href="/tagged/whatever">LINK</a>
  1163. <br>
  1164. <a href="/tagged/whatever">LINK</a>
  1165. <a href="/tagged/whatever">LINK</a>
  1166. <br>
  1167. <a href="/tagged/whatever">LINK</a>
  1168. <a href="/tagged/whatever">LINK</a>
  1169. <br>
  1170. <a href="/tagged/whatever">LINK</a>
  1171. <a href="/tagged/whatever">LINK</a>
  1172. <br>
  1173. <a href="/tagged/whatever">LINK</a>
  1174. <a href="/tagged/whatever">LINK</a>
  1175. <br>
  1176. <a href="/tagged/whatever">LINK</a>
  1177. <a href="/tagged/whatever">LINK</a>
  1178. <br>
  1179. </div>
  1180.  
  1181. </li>
  1182. <!----------------------- MAINS & EXCLUSIVES? END -------------------->
  1183. <!------------------------------ EXTRA TAB --------------------------->
  1184. <li>
  1185. <h2>Tab number five here we go!</h2>
  1186. </li>
  1187.  
  1188. <!-------------------------- EXTRA TAB END --------------------------->
  1189. </ul>
  1190. </div></div>
  1191. <!----------------------------- TABS END ---------------------------->
  1192.  
  1193.  
  1194.  
  1195.  
  1196. <!------------------------ NAVIGATION START ------------------------->
  1197.  
  1198. <div class="links" style="margin-left: 65px;">
  1199.  
  1200. <center>
  1201. <a href="/" class="poplight third" title="refresh" style="padding-right: 1px;">001.</a>
  1202. <a href="/ask" class="poplight third" title="ask">002.</a>
  1203. <a href="#?w=330" rel="box2" class="poplight third" title="rules">003.</a>
  1204. </center>
  1205.  
  1206. </div>
  1207. <!------------------------ NAVIGATION END ------------------------->
  1208.  
  1209. <!----------------------------- CREDIT ------------------------------>
  1210.  
  1211. <div class="credit">
  1212. <a href="https://themesbyzorra.tumblr.com/" title="Themes By Zorra">♛</a>
  1213. </div>
  1214. </body>
  1215.  
  1216. <!--------------------------- CREDIT END ----------------------------->
  1217.  
  1218.  
  1219. <!------------------------- BLOG CONTENT ----------------------------->
  1220.  
  1221. <div class="pagination">{block:Pagination}
  1222. {block:PreviousPage}<a href="{PreviousPage}" class="fourth" style="margin-left: 0px;">☚</a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" class="fourth" style="margin-right: 0x;">☛</a>
  1223. {/block:NextPage}
  1224. {/block:Pagination}</div>
  1225.  
  1226. <div id="container">
  1227.  
  1228. {block:Posts}
  1229.  
  1230. <div class="posts">
  1231.  
  1232. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  1233.  
  1234. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}
  1235. {/block:Photo}
  1236.  
  1237. {block:Photoset}{Photoset}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1238.  
  1239. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  1240.  
  1241. {block:Video}
  1242. <div class="video">{Video-500}</div>
  1243. {/block:Video}
  1244.  
  1245. {block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Panorama}
  1246.  
  1247.  
  1248. {block:Quote}<quotetext>❝{Quote}❞</quotetext>{block:Source}<h3>{Source}</h3>{/block:Source}{/block:Quote}
  1249.  
  1250.  
  1251. {block:Chat}
  1252. {block:Title}
  1253. <h1>{Title}</h1>{/block:Title}<br>
  1254. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  1255. {Line}</li>{/block:Lines}</ul>
  1256. {/block:Chat}
  1257.  
  1258.  
  1259. <!--------------------------- AUDIO POST ------------------------------>
  1260. {block:Audio}
  1261. {block:AlbumArt}
  1262. <div class="songart">
  1263. <img src="{AlbumArtURL}">
  1264. </div>
  1265. {/block:AlbumArt}
  1266. <div class="songtitle">
  1267. {block:TrackName}
  1268. {TrackName}
  1269. {/block:TrackName}
  1270. </div>
  1271. <div class="songauthor">
  1272. By
  1273. {block:Artist}
  1274. {Artist}
  1275. {/block:Artist}
  1276. </div>
  1277. {AudioPlayerWhite}
  1278. {/block:Audio}
  1279.  
  1280.  
  1281.  
  1282. {block:Answer}
  1283. <div id="askerurl" style="margin-left:-50px; margin-top:0px; text-transform:uppercase; font-size: 13px; color: {color:bold}; word-wrap: break-word; max-width: 100%;">{asker}</div>
  1284.  
  1285.  
  1286. <div id="question" style="margin-top: -5px">{Question}</div>
  1287. <div id="answer" style="margin-top: 20px;">{Answer}</div>
  1288. {/block:Answer}
  1289.  
  1290.  
  1291. <!----------------------- INFO & SYMBOLS ----------------------------->
  1292.  
  1293. <div id="infobox">
  1294. <div id="info">
  1295. <br>
  1296.  
  1297. &nbsp; &nbsp;
  1298.  
  1299.  
  1300.  
  1301. {block:Date}
  1302. <a href="{Permalink}"style="position:absolute; width: autopx; margin-left:-40px; margin-top:30px; font-size: 12px; font-family: 'Oswald', sans-serif;" title="{TimeAgo}, {ShortMonth} {DayOfMonthWithZero} with {NoteCount} notes ">{ShortMonth} {DayOfMonthWithZero} </a>
  1303. {/block:Date}
  1304.  
  1305.  
  1306. <a href="{ReblogURL}" style="position:absolute; margin-left:-40px; margin-top:45px; font-size:12px; font-family: 'Oswald', sans-serif;';" title="reblog"> Reblog </a>
  1307.  
  1308.  
  1309.  
  1310. {block:NoRebloggedFrom}
  1311. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1312. {/block:NoRebloggedFrom}
  1313.  
  1314.  
  1315. {block:ContentSource}
  1316. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1317. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1318. {/block:SourceLogo}
  1319. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1320. {/block:ContentSource}
  1321. <br>
  1322.  
  1323.  
  1324. <!------------------- INFO & SYMBOLS ENDS --------------------------->
  1325.  
  1326.  
  1327. {block:HasTags}<div id="tags">{block:Tags}&nbsp;<a href="{TagURL}" title="{Tag}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div> &nbsp;
  1328.  
  1329. <br><br><br><br>
  1330. </div>
  1331. </div>
  1332.  
  1333. {/block:Posts}
  1334. <div class="notecontainer">
  1335. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1336. </div></div>
  1337. {/block:Posts}
  1338.  
  1339. </div>
  1340.  
  1341.  
  1342.  
  1343.  
  1344.  
  1345. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!