bridgetowakanda

THEME 002: HISTORICAL CONTEXT by THEMESBYZORRA

Aug 3rd, 2018
361
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.04 KB | None | 0 0
  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. <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
  15.  
  16.  
  17.  
  18. <html>
  19. <!--
  20. - BASE CODE
  21. https://fratdadbase.tumblr.com/
  22.  
  23. - THEME BY ZORRA @ THEMESBYZORRA
  24. - THEME IS FREE FOR USE BY THE TUMBLR COMMUNITY. PLEASE LEAVE CREDIT WHERE IT IS DUE.
  25. - 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.
  26. - THEME 002: HISTORICAL CONTEXT by THEMESBYZORRA
  27. -->
  28.  
  29.  
  30. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  31. <head>
  32. <title>{Title}</title>
  33. <link rel="shortcut icon" href="{Favicon}">
  34. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  35. {block:Description}
  36. <meta name="description" content="{MetaDescription}" />
  37. {/block:Description}
  38.  
  39.  
  40. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  41.  
  42. <!------------------------------ SCRIPTS ----------------------------->
  43. <!------------------------------ POPUP ------------------------------>
  44.  
  45.  
  46. <script type="text/javascript"
  47. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  48. <script>
  49. $(document).ready(function() {
  50. //
  51. $('a.poplight[href^=#]').click(function() {
  52. var popID = $(this).attr('rel'); //Get Popup Name
  53. var popURL = $(this).attr('href'); //Get Popup href to define size
  54. var query= popURL.split('?');
  55. var dim= query[1].split('&');
  56. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  57. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close">');
  58. var popMargTop = ($('#' + popID).height() + 80) / 2;
  59. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  60. //Apply Margin to Popup
  61. $('#' + popID).css({
  62. 'margin-top' : -popMargTop,
  63. 'margin-left' : -popMargLeft
  64. });
  65. $('body').append('<div id="fade"></div>');
  66. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  67. return false;
  68. });
  69. $('a.close, #fade').live('click', function() {
  70. $('#fade , .popup_block').fadeOut(function() {
  71. $('#fade, a.close').remove(); //fade them both out
  72. });
  73. return false;
  74. });
  75. });
  76. </script>
  77.  
  78.  
  79.  
  80.  
  81. <!----------------------------- TOOLTLIP ----------------------------->
  82.  
  83.  
  84. <link href="https://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  85. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  86. <script src="https://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  87. <script>
  88. (function($){
  89. $(document).ready(function(){
  90. $("[title]").style_my_tooltips({
  91. tip_follows_cursor:true,
  92. tip_delay_time:200,
  93. tip_fade_speed:500
  94. });
  95. });
  96. })(jQuery);
  97. </script>
  98.  
  99.  
  100.  
  101. <!------------------------------ TABS ------------------------------>
  102.  
  103.  
  104. <script>
  105. $(document).ready(function(){
  106. $("ul#tabs li").click(function(e){
  107. if (!$(this).hasClass("active")) {
  108. var tabNum = $(this).index();
  109. var nthChild = tabNum+1;
  110. $("ul#tabs li.active").removeClass("active");
  111. $(this).addClass("active");
  112. $("ul#tab li.active").removeClass("active");
  113. $("ul#tab li:nth-child("+nthChild+")").addClass("active");
  114. }
  115. });
  116. });
  117. </script>
  118.  
  119. <!------------------------------ VIDEO ------------------------------>
  120.  
  121. <!------ script provided by: http://shythemes.tumblr.com/post/123250129923/tutorial-resizing-videos ----->
  122.  
  123. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  124. <script>
  125. $(document).ready(function(){
  126. $('.video iframe').each(function(){
  127. var scale = $(this).parents('.video').width() / 500;
  128. $(this).attr({
  129. width: Math.floor($(this).attr('width') * scale),
  130. height: Math.floor($(this).attr('height') * scale)
  131. });
  132. });
  133. });
  134. </script>
  135.  
  136. <!---------------------------- META DATA ----------------------------->
  137. <meta name="image:Background" content="" />
  138. <meta name="image:headerbackground" content=""/>
  139. <meta name="image:sidebox" content="" />
  140.  
  141. <meta name="text:Starters" content="00"/>
  142. <meta name="text:Drafts" content="00"/>
  143. <meta name="text:Memes" content="00"/>
  144. <meta name="text:Quote" content="Quote Here" />
  145.  
  146. <meta name="color:background" content="#f6f6f6" />
  147. <meta name="color:postbackground" content="#ffffff" />
  148. <meta name="color:font" conteont="#b2b1b1" />
  149. <meta name="color:italic" content="#cac8c8" />
  150. <meta name="color:bold" content="#9f9d9d" />
  151. <meta name="color:postborder" content="#ecebeb" />
  152. <meta name="color:info" content="#cac8c8" />
  153. <meta name="color:infohover" content="#000000" />
  154. <meta name="color:blockquote" content="#000000" />
  155. <meta name="color:link" content="#222222" />
  156. <meta name="color:linkhover" content="#333333" />
  157. <meta name="color:h1" content="#ffffff" />
  158. <meta name="color:h1shadow" content="#222222" />
  159. <meta name="color:h2" content="#e7dcd6" />
  160. <meta name="color:h3" content="#111111" />
  161. <meta name="color:h3background" content="#c8c6bf" />
  162. <meta name="color:question" content="#e5e5e5" />
  163. <meta name="color:questionborder" content="#bbbbbb" />
  164. <meta name="color:popuplink" content="#111111" />
  165.  
  166. <meta name="select:info link background" content="#ffffff" title="white"/>
  167. <meta name="select:info link background" content="#000000" title="black"/>
  168.  
  169.  
  170. <meta name="select:header font1" content="'Rozha One', serif;" title="Rozha"/>
  171. <meta name="select:header font1" content="'Limelight', cursive;" title="Limelight"/>
  172. <meta name="select:header font1" content="'Anton', sans-serif;" title="Anton"/>
  173.  
  174. <meta name="select:header font2" content="'Rozha One', serif;" title="Rozha"/>
  175. <meta name="select:header font2" content="'Limelight', cursive;" title="Limelight"/>
  176. <meta name="select:header font2" content="'Anton', sans-serif;" title="Anton"/>
  177.  
  178.  
  179. </head>
  180.  
  181.  
  182.  
  183.  
  184.  
  185. <style type="text/css">
  186.  
  187. @font-face​ {
  188. font-family:"big noodle titling";
  189. src:url(https://dl.dropbox.com/s/j5blixn0eu397vv/big_noodle_titling.ttf');
  190. }
  191.  
  192. /*---------------------------- SCROLL BAR ---------------------------*/
  193. ::-webkit-scrollbar {
  194. width: 2px;
  195. height: 2px;
  196. }
  197. ::-webkit-scrollbar-button {
  198. width: 0px;
  199. height: 0px;
  200. }
  201. ::-webkit-scrollbar-thumb {
  202. background: transparent;
  203. border: 0px none #a68b7c;
  204. border-radius: 50px;
  205. }
  206. ::-webkit-scrollbar-thumb:hover {
  207. background: transparent;
  208. }
  209. ::-webkit-scrollbar-thumb:active {
  210. background: transparent;
  211. }
  212. ::-webkit-scrollbar-track {
  213. background: transparent;
  214. border: 0px none #a68b7c;
  215. border-radius: 0px;
  216. }
  217. ::-webkit-scrollbar-track:hover {
  218. background:transparent;
  219. }
  220. ::-webkit-scrollbar-track:active {
  221. background: transparent;
  222. }
  223. ::-webkit-scrollbar-corner {
  224. background: transparent;
  225. }
  226.  
  227.  
  228. /*---------------------------- SELECTION ---------------------------*/
  229.  
  230. ::SELECTION {BACKGROUND: {color:bold}; COLOR:#e7e5d1; }
  231. ::-MOZ-SELECTION {BACKGROUND: {color:bold}; COLOR:#e7e5d1; }
  232.  
  233.  
  234.  
  235. /*---------------------------- BODY ---------------------------*/
  236.  
  237. body {
  238. background-color:{color:background};
  239. background-image:url('{image:background}');
  240. background-attachment: fixed;
  241. background-repeat: no-repeat;
  242. font-family: 'Abel', sans-serif;
  243. font-size: 10px;
  244. text-align: justify;
  245. color: {color:font};
  246. }
  247.  
  248. #container {
  249. position:absolute;
  250. background-color: transparent;
  251. width: 460px;
  252. top: 0px;
  253. margin-top:0px;
  254. margin-left: 400px;
  255. height:100%;
  256. padding: 10px;
  257. overflow:auto;
  258. overflow-x:hidden;
  259.  
  260. }
  261.  
  262. .posts {
  263. background-color: {color:postbackground};
  264. border: 5px double {color:postborder};
  265. width:400px;
  266. margin-left:30px;
  267. margin-bottom:20px;
  268. padding: 13px;
  269.  
  270. }
  271.  
  272. #container img {
  273. height:auto;
  274. max-width:100%;
  275. }
  276.  
  277. #post img {
  278. height: auto;
  279. max-width: 100%;
  280. }
  281.  
  282.  
  283. /*---------------------- QUESTIONS & ANSWERS ------------------------*/
  284.  
  285. #askerurl {
  286. text-transform:uppercase;
  287. font-weight:400;
  288. font-size:20px;
  289. margin-top:80px;
  290. margin-left:50px;
  291. padding-bottom:5px;
  292. width:250px;
  293. font-family: 'Orbitron', sans-serif;
  294. text-align:center;
  295. }
  296.  
  297. #asking img {
  298. padding: 5px;
  299. }
  300.  
  301. #question {
  302. background-attachment:auto;
  303. background-image: url('');
  304. padding:15px 15px;
  305. margin:3px 0 3px 10px;
  306. border-right:5px solid {color:questionborder};
  307. border-radius: 5px;
  308. background-color:{color:question};
  309. color: {color:font};
  310. font-family: 'Open Sans Condensed';
  311. -webkit-border-radius: 10px;
  312. }
  313.  
  314. #answer {
  315. word-spacing: 0px;
  316. }
  317.  
  318.  
  319. /*---------------------------- NAVIGATION ---------------------------*/
  320.  
  321. .links {
  322. top: 550px;
  323. left: 200px;
  324. position: fixed;
  325. width: auto
  326. height: auto;
  327. text-align: center;
  328. }
  329.  
  330.  
  331.  
  332. /*---------------------------- SIDEBOXS ---------------------------*/
  333.  
  334.  
  335. .sidebox {
  336. position: fixed;
  337. background-color: {color:postbackground};
  338. border: 5px double {color:postborder};
  339. top: 200px;
  340. left: 180px;
  341. width: 175px;
  342. height: 300px;
  343. overflow: auto;
  344. padding: 15px;
  345. z-index: 1;
  346. }
  347.  
  348.  
  349. /*---------------------------- CREDIT ---------------------------*/
  350.  
  351. .credit {
  352. left: 98%;
  353. top: 95%;
  354. width: 50px;
  355. height: 50px;
  356. position: fixed;
  357. }
  358.  
  359. a.credit, a.credit:link, a.credit:active, a.credit:visited{
  360. text-decoration: none;
  361. color: #8f3d2e;
  362. text-transform: none;
  363. font-family: 'Contrail One', cursive;
  364. font-size: 14px;
  365. -moz-transition-duration:.6s;
  366. -webkit-transition-duration:.6s;
  367. -o-transition-duration:.6s;
  368. -webkit-filter: blur(0px);
  369.  
  370. }
  371.  
  372. a.credit:hovor {
  373. color: #8f8f8f;
  374. font-family: 'Contrail One', cursive;
  375. letter-spacing: 0px;
  376. -moz-transition-duration:.6s;
  377. -webkit-transition-duration:.6s;
  378. -o-transition-duration:.6s;
  379. -webkit-filter: blur(0px); }
  380.  
  381.  
  382.  
  383. /*---------------------------- FANCY FONT ---------------------------*/
  384.  
  385. h1 {
  386. font-size:30px;
  387. font-family: {select:header font1};
  388. font-weight:400;
  389. color:{color:h1};
  390. border-bottom: 1px solid {color:h1};
  391. text-shadow: 1px 1px 1px {color:h1shadow};
  392. display:block;
  393. margin-top: 20px;
  394. text-align:right;
  395. text-transform:uppercase;
  396. padding:10px;
  397. letter-spacing:3px;
  398.  
  399. }
  400.  
  401. h2 {
  402. font-size:12px
  403. font-family: {select:header font2};
  404. font-weight:400;
  405. color:{color:h2};
  406. text-align: center;
  407. text-transform:lowercase;
  408. letter-spacing:2px;
  409. display:block;
  410. margin:0, 0, 5px, 0;
  411. padding:5px;
  412. }
  413.  
  414.  
  415. h3 {
  416. background-image: url('{image:headerbackground}');
  417. background-color: {color:h3background};
  418. background-repeat:repeat;
  419. background-attachment:fixed;
  420. border: double 3px {color:postborder};
  421. padding:3px;
  422. color:{color:h3};
  423. text-shadow:1px 1px 2px #000,
  424. font-size:15px;
  425. font-family: 'Source Code Pro', monospace;
  426. text-transform:uppercase;
  427. letter-spacing:1px;
  428. text-align:center;
  429. overflow:auto;
  430.  
  431. }
  432.  
  433.  
  434.  
  435. i, italic, em {
  436. font-family: 'Peddana', serif;
  437. font-size: 15px;
  438. text-transform: italic;
  439. color:{color:italic};
  440. text-transform:lowercase;
  441. letter-spacing:1px;
  442. text-shadow: 1px 1px #000;
  443.  
  444. }
  445.  
  446. b, bold, strong {
  447. font-size:10px;
  448. font-family: 'Orbitron', sans-serif;
  449. color:{color:bold};
  450. text-transform:lowercase;
  451.  
  452. }
  453. u, underline {font:8px 'Fjalla One'; font-weight:400; color:#79b4a8; text-transform:uppercase; letter-spacing:1px;}
  454.  
  455. p {
  456. margin-top:5px;
  457. margin-bottom:5px;}
  458.  
  459.  
  460. ol {
  461. list-style:normal;}
  462.  
  463.  
  464. ul {
  465. list-style:square;}
  466.  
  467.  
  468. small {
  469. font-size:10px}
  470.  
  471.  
  472. sup,sub {
  473. font-size:11px}
  474.  
  475.  
  476.  
  477. blockquote {
  478. padding:2px 7px;
  479. padding-right:17px;
  480. margin:3px 0 3px 10px;
  481. border-left:1px solid {color:blockquote};
  482. -webkit-border-radius: 10px;
  483. }
  484.  
  485.  
  486. blockquote img{
  487. max-width:100%;
  488. height:auto;
  489. }
  490.  
  491. blockquote blockquote img{
  492. max-width:100%;
  493. height:auto;
  494. }
  495.  
  496.  
  497.  
  498.  
  499. t, title {
  500. size: 15px;
  501. color: 222;
  502. letter-spacing: 2px;
  503. font: times;
  504. }
  505.  
  506. quotetext {
  507. font-family: times;
  508. font-size: 20px;
  509. line-height: 21px;
  510. letter-spacing: 2px;
  511. text-align: center;
  512. text-transform:uppercase;
  513. color: #fff;
  514. text-shadow: 3px 1px 1px #79b4a8;
  515. }
  516.  
  517. quotations {
  518. font: courier;
  519. font-size: 30px;
  520. color: {color:bold};
  521. }
  522.  
  523. quote {
  524. font-size: 13px;
  525. }
  526.  
  527. img {
  528. max-width:100%;
  529. }
  530.  
  531. hr {
  532. width:100px;
  533. border: 0;
  534. height: 0.5px;
  535. margin-right:10px;
  536. background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 255), rgba(255, 255, 255, 0));
  537. }
  538.  
  539.  
  540. /*---------------------------- LINKS ---------------------------*/
  541.  
  542. a:link, a:active, a:visited {
  543. text-decoration: none;
  544. color: {color:link};
  545. text-transform: none;
  546. font-family: 'Open Sans Condensed', sans-serif;
  547. font-size: 14px;
  548. -moz-transition-duration:.6s;
  549. -webkit-transition-duration:.6s;
  550. -o-transition-duration:.6s;
  551. -webkit-filter: blur(0px);}
  552.  
  553. a:hover {
  554. color: {color:linkhover};
  555. font-family: 'Open Sans Condensed', sans-serif;
  556. letter-spacing: 0px;
  557. -moz-transition-duration:.6s;
  558. -webkit-transition-duration:.6s;
  559. -o-transition-duration:.6s;
  560. -webkit-filter: blur(0px);}
  561.  
  562.  
  563.  
  564. a.navi, a.navi:link, a.navi:active, a.navi:visited {
  565. color: #a68b7c;
  566. text-shadow: 0px 0px 10px #a68b7c;
  567. font-family: times;
  568. font-size: 12px;
  569.  
  570. }
  571.  
  572. a.navi:hover {
  573. -moz-transition-duration:.6s;
  574. -webkit-transition-duration:.6s;
  575. -o-transition-duration:.6s;
  576. -webkit-filter: blur(0px);
  577. }
  578.  
  579.  
  580.  
  581.  
  582. /*---------------------------- PAGINATION ---------------------------*/
  583.  
  584.  
  585. .pagination {
  586. position:fixed;
  587. top: 175px;
  588. left: 245px;
  589. height: 100px;
  590. width: 100px;
  591. text-align:center;
  592. }
  593.  
  594.  
  595.  
  596.  
  597. /*------------------------ POST INFO & TAGS -------------------------*/
  598.  
  599.  
  600.  
  601. #infobox {
  602. border:1px solid transparent;
  603. margin-bottom:0px;
  604. padding-top:10px;
  605. border-bottom:0px solid {color:postborder};
  606. }
  607.  
  608.  
  609. #info {
  610. margin-left:20px;
  611. padding-bottom: 2px;
  612. }
  613.  
  614. #info a {
  615. color:{color:info};
  616. text-shadow: 1px 1px {select:info link background};
  617. opacity: 1;
  618. font-family: 'Source Code Pro', monospace;
  619. text-transform: uppercase;
  620. }
  621.  
  622. #info a:hover {
  623. color:{color:infohover};
  624. opacity: 1;
  625. }
  626.  
  627.  
  628.  
  629. #tags {
  630. width:375px;
  631. height: 25px;
  632. font-size:7px;
  633. text-align:right;
  634. font-family:arial;
  635. text-transform:uppercase;
  636. background:transparent;
  637. border-top: 1px solid {color:postborder};
  638. overflow: auto;
  639. margin-top:10px;
  640. margin-left:-10px;
  641. max-height:45px;
  642. margin-bottom: -50px;
  643. padding-top:5px;
  644. }
  645.  
  646.  
  647. #tags a {
  648. font-family:consolas;
  649. font-size:8px;
  650. line-height:8pt;
  651. letter-spacing:0px;
  652. color:{color:bold};
  653. text-decoration:none;
  654. text-shadow: 0px 0px {select:info link background};
  655. text-transform:uppercase;
  656. letter-spacing:0px;
  657. text-align:center;
  658. display:inline-block;
  659. }
  660.  
  661.  
  662. #tags a:hover {
  663. color:{color:bold};
  664. filter: blur(0px);
  665. -webkit-transition: all 0.6s ease-in-out;
  666. -moz-transition: all 0.6s ease-in-out;
  667. -o-transition: all 0.6s ease-in-out;
  668. -ms-transition: all 0.6s ease-in-out;
  669. transition: all 0.6s ease-in-out;
  670. }
  671.  
  672.  
  673.  
  674.  
  675.  
  676.  
  677. /*---------------------------- EXTRA 1 ---------------------------*/
  678.  
  679.  
  680.  
  681. .notecontainer {
  682. background-color: transparent;
  683. border: 0px solid transparent;
  684. width:380px;
  685. padding: 0px;
  686. text-transform:uppercase;
  687. font-style:normal;
  688. font-size: 10px;
  689. height: 150px;
  690. overflow: auto;
  691. margin-left: 50px;
  692. text-align:left;
  693.  
  694. }
  695. .note {
  696. background-color: transparent;
  697. border: 1px solid transparent;
  698. width:280px;
  699. padding: 0px;
  700. text-transform:uppercase;
  701. font-style:normal;
  702. font-size: 10px;
  703. height: auto;
  704. overflow: auto;
  705. margin-left: -25px;
  706. text-align:left;
  707.  
  708. }
  709.  
  710. .note li {
  711. list-style-type:none;
  712. padding: 10px;
  713. text-align:left;
  714. margin:0px;
  715. -moz-transition-duration:0.5s;
  716. -webkit-transition-duration:0.5s;
  717. -o-transition-duration:0.5s;}
  718.  
  719. .note img.avatar {
  720. margin-right: 10px;
  721. width: 25px;
  722. height: 25px;}
  723.  
  724.  
  725.  
  726.  
  727. /*-------------------------- MUSIC PLAYER ---------------------------*/
  728.  
  729.  
  730.  
  731. .songart{
  732. float:left;
  733. margin-right:10px;
  734. }
  735.  
  736. .songart img{
  737. width:80px;
  738. height:80px;
  739. }
  740.  
  741. .songtitle{
  742. margin-bottom:10px;
  743. margin-left:90px;
  744. }
  745.  
  746. .songauthor{
  747. margin-bottom:10px;
  748. font-size:8px;
  749. margin-left:90px;
  750. }
  751.  
  752. .tumblr_audio_player {
  753. height: 50px;
  754. }
  755.  
  756.  
  757.  
  758. /*---------------------------- TOOLTIP ---------------------------*/
  759.  
  760.  
  761.  
  762. #s-m-t-tooltip{
  763. max-width:400px;
  764. margin:15px;
  765. padding:2px 8px;
  766. background: #1c0915;
  767. background-image:url('{image:headerbackground}');
  768. background-repeat:repeat;
  769. background-attachment:fixed;
  770. border: double 3px #000;
  771. color:#fff;
  772. text-shadow:1px 1px 0px #000,
  773. z-index:99999999999999999999;
  774. font-size:9px;
  775. letter-spacing:2px;
  776. font-style:bold;
  777. letter-spacing:2px;
  778. font-family: calibri;
  779. text-transform:uppercase;
  780. box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  781.  
  782.  
  783.  
  784. /*--------------------------- POPUP ------------------------------ */
  785.  
  786.  
  787. /*--Making IE6 Understand Fixed Positioning--*/
  788. *html #fade {
  789. position: absolute;
  790. }
  791. *html .popup_block {
  792. position: absolute;
  793. }
  794.  
  795. .popup_block{
  796. background-color: {color:background};
  797. border: 1px solid {color:postborder};
  798. width:330px;
  799. height:750px;
  800. top:400px;
  801. padding: 10px;
  802. left: 650px;
  803. display: none; /*--hidden by default--*/
  804. float: left;
  805. font-size: 10px; /*font size of the words inside the box */
  806. position: fixed;
  807. z-index: 99999; /*if the box is hiding behind other things in your theme, add more 9′s */
  808. }
  809.  
  810.  
  811. #fade { /*--Transparent background layer--*/
  812. display: none; /*--hidden by default--*/
  813. background: transparent;
  814. background-image: url('{image:popup}'); /*if you want to add a background image to go behind your popup */
  815. position: fixed; left: 0; top: 0;
  816. width: 100%; height: 100%;
  817. opacity: 1.0;
  818. z-index: 9999;
  819. }
  820.  
  821. .popupnavlinks {
  822. padding-top:5px;
  823. text-align:center; }
  824.  
  825.  
  826. .popupnavlinks a {
  827. display:inline-block;
  828. width:90px; height:4px;
  829. margin:2px; padding:3px 6px 10px;
  830. text-align:center;
  831. background-image: url('');
  832. background:transparent;
  833. background-repeat:repeat;
  834. background-attachment:fixed;
  835. border: solid 1px {color:popuplink};
  836. color:{color:popuplink};
  837. font-size:9px;
  838. font-family:calibri;
  839. text-shadow:1px 1px 0px #fff,
  840. display: inline-block;
  841. cursor: pointer;
  842. }
  843.  
  844. .popupnavlinks a:hover {
  845. display:inline-block;
  846. letter-spacing:2px;
  847. -moz-transition-duration: 0.4s;
  848. -webkit-transition-duration: 0.4s;
  849. -o-transition-duration: 0.4s;
  850. transition-duration: 0.4s;
  851. }
  852.  
  853.  
  854.  
  855. .popupclose {
  856. float:right; top:0px; right:0px;
  857. margin-top:-10px; margin-right:-10px;
  858. font-family:'Scada', sans serif;
  859. font-size:10px;
  860. font-weight:bold }
  861.  
  862. .popupclose a {
  863. color:#aaa }
  864.  
  865.  
  866.  
  867. /*----------------------------- TABS ------------------------------- */
  868.  
  869. ul#tabs {
  870. list-style-type: none;
  871. padding: 0;
  872. text-align: justify;
  873. font-size:8px;
  874. letter-spacing:1px;
  875. }
  876. ul#tabs li {
  877. background-color: transparent;
  878. border: 0px solid {color:postborder};
  879. border-radius: 2px;
  880. background-repeat:repeat;
  881. background-attachment:fixed;
  882. background-image: url('');
  883. display: inline-block;
  884. padding: 4px 10px;
  885. margin-bottom: 4px;
  886. margin-left: 2px;
  887. cursor: pointer;
  888. color: {color:italic};
  889. text-align: center;
  890. }
  891. ul#tabs li:hover {
  892. background-color: transparent;
  893. border-radius: 2px;
  894. color: {color:linkhover};
  895. text-shadow: 1px 1px 3px #111;
  896. }
  897. ul#tabs li.active {
  898. background-image: url('');
  899. background:transparent;
  900. background-repeat:repeat;
  901. background-attachment:fixed;
  902. border: 0px solid {color:postborder};
  903. color:{color:bold};
  904. display: inline-block;
  905. padding: 4px 10px;
  906. margin-bottom: 4px;
  907. cursor: pointer;
  908. border-radius: 2px;
  909. text-align: center;
  910. }
  911. ul#tab {
  912. list-style-type: none;
  913. margin: 0;
  914. padding: 0;
  915. }
  916. ul#tab li {
  917. display: none;
  918. }
  919. ul#tab li.active {
  920. display: block;
  921. }
  922.  
  923.  
  924. .esperanza {
  925. position: fixed;
  926. background-color: {color:background};
  927. border: 0px solid {color:postborder};
  928. padding: 5px;
  929. top: 0px;
  930. left: 450px;
  931. width: 320px;
  932. height: 15px;
  933. overflow: auto;
  934. z-index: 999999999999;
  935.  
  936. }
  937.  
  938. /* ----------------------------- CHAT CODE --------------------------- */
  939.  
  940. /* chat cred: http://dear-indies.tumblr.com/post/125257866576/animalites-imessage-chat-post-ive-seen-a-lot */
  941.  
  942. /* IMESSAGE CHAT POST */
  943. .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}
  944. .asked p {
  945. text-align: left;
  946. margin: 0 0px 10px 0px;
  947. padding: 0;
  948. color: #666666;
  949. font-family: 'Inconsolata', Inconsolata;
  950. font-size: 12px;
  951. line-height: 0px;
  952. }
  953. .footerright .viasrc {
  954. float: left;
  955. }
  956. .asked a {
  957. margin:0;padding:0;
  958. }
  959. .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}
  960. .convo {
  961. overflow: hidden;
  962. list-style-type: none;
  963. padding: 0;
  964. margin: 0;
  965. }
  966.  
  967. </style>
  968.  
  969.  
  970.  
  971. <body>
  972.  
  973. <!--------------------------- SIDEBOX -------------------------------->
  974.  
  975. <div class="sidebox">
  976.  
  977. <img src="{image:sidebox}">
  978.  
  979. <h2>ALISES OR SOMETHING HERE</h2>
  980. <center><b>MAYBE A QUOTE HERE</b></center>
  981.  
  982.  
  983. <p>
  984. <p>
  985. <h3>DEBTS</h3>
  986. <center>
  987. <b>Starters:</b> {text:Starters} <br> <b>Drafts:</b> {text:Drafts} <br> <b>Memes:</b> {text:Memes}
  988. </center>
  989.  
  990.  
  991. <br>
  992. <h3>Pennd By</h3>
  993.  
  994. <center>
  995. <i>PENNAME HERE</i>
  996.  
  997. </center>
  998. </div>
  999.  
  1000.  
  1001.  
  1002.  
  1003.  
  1004. <!------------------------ NAVIGATION START ------------------------->
  1005.  
  1006. <div class="links" style="margin-left: 35px;">
  1007.  
  1008. <center>
  1009. <a href="/" class="poplight third" title="refresh" style="padding-right: 3px; text-transform: uppercase; font-size:10px;">Home</a>
  1010. <a href="/ask" class="poplight third" title="ask" style="padding-right: 3px; text-transform: uppercase; font-size:10px;">Ask</a>
  1011. <a href="/" class="poplight third" title="link 3" style="padding-right: 3px; text-transform: uppercase; font-size:10px;">Link 3</a>
  1012. <a href="/" class="poplight third" title="link 4" style="padding-right: 3px; text-transform: uppercase; font-size:10px;">Link 4</a>
  1013. <a href="/" class="poplight third" title="link 5" style="padding-right: 3px; text-transform: uppercase; font-size:10px;">Link 5</a>
  1014. </center>
  1015.  
  1016. </div>
  1017. <!------------------------ NAVIGATION END ------------------------->
  1018.  
  1019. <!----------------------------- CREDIT ------------------------------>
  1020.  
  1021. <div class="credit">
  1022. <a href="https://themesbyzorra.tumblr.com/" title="Themes By Zorra">♛</a>
  1023. </div>
  1024. </body>
  1025.  
  1026. <!--------------------------- CREDIT END ----------------------------->
  1027.  
  1028.  
  1029. <!------------------------- BLOG CONTENT ----------------------------->
  1030.  
  1031. <div class="pagination">{block:Pagination}
  1032. {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>
  1033. {/block:NextPage}
  1034. {/block:Pagination}</div>
  1035.  
  1036. <div id="container">
  1037.  
  1038. {block:Posts}
  1039.  
  1040. <div class="posts">
  1041.  
  1042. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  1043.  
  1044. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}
  1045. {/block:Photo}
  1046.  
  1047. {block:Photoset}{Photoset}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1048.  
  1049. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  1050.  
  1051. {block:Video}
  1052. <div class="video">{Video-500}</div>
  1053. {/block:Video}
  1054.  
  1055. {block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Panorama}
  1056.  
  1057.  
  1058. {block:Quote}<quotetext>❝{Quote}❞</quotetext>{block:Source}<h3>{Source}</h3>{/block:Source}{/block:Quote}
  1059.  
  1060.  
  1061. {block:Chat}
  1062. {block:Title}
  1063. <h1>{Title}</h1>{/block:Title}<br>
  1064. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  1065. {Line}</li>{/block:Lines}</ul>
  1066. {/block:Chat}
  1067.  
  1068.  
  1069. <!--------------------------- AUDIO POST ------------------------------>
  1070. {block:Audio}
  1071. {block:AlbumArt}
  1072. <div class="songart">
  1073. <img src="{AlbumArtURL}">
  1074. </div>
  1075. {/block:AlbumArt}
  1076. <div class="songtitle">
  1077. {block:TrackName}
  1078. {TrackName}
  1079. {/block:TrackName}
  1080. </div>
  1081. <div class="songauthor">
  1082. By
  1083. {block:Artist}
  1084. {Artist}
  1085. {/block:Artist}
  1086. </div>
  1087. {AudioPlayerWhite}
  1088. {/block:Audio}
  1089.  
  1090.  
  1091.  
  1092. {block:Answer}
  1093. <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>
  1094.  
  1095.  
  1096. <div id="question" style="margin-top: -5px">{Question}</div>
  1097. <div id="answer" style="margin-top: 20px;">{Answer}</div>
  1098. {/block:Answer}
  1099.  
  1100.  
  1101. <!----------------------- INFO & SYMBOLS ----------------------------->
  1102.  
  1103. <div id="infobox">
  1104. <div id="info">
  1105. <br>
  1106.  
  1107. &nbsp; &nbsp;
  1108.  
  1109.  
  1110.  
  1111. {block:Date}
  1112. <a href="{Permalink}"style="position:absolute; width: autopx; margin-left:-20px; margin-top:0px; font-size: 12px; font-family: 'Source Code Pro', monospace;" title="{TimeAgo}, {ShortMonth} {DayOfMonthWithZero} with {NoteCount} notes ">{ShortMonth} {DayOfMonthWithZero} </a>
  1113. {/block:Date}
  1114.  
  1115.  
  1116. <a href="{ReblogURL}" style="position:absolute; margin-left:35px; margin-top:0px; font-size:12px; font-family: 'Source Code Pro', monospace;" title="reblog"> Reblog </a>
  1117.  
  1118.  
  1119.  
  1120. {block:NoRebloggedFrom}
  1121. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1122. {/block:NoRebloggedFrom}
  1123.  
  1124.  
  1125. {block:ContentSource}
  1126. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1127. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1128. {/block:SourceLogo}
  1129. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1130. {/block:ContentSource}
  1131. <br>
  1132.  
  1133.  
  1134. <!------------------- INFO & SYMBOLS ENDS --------------------------->
  1135.  
  1136.  
  1137. {block:HasTags}<div id="tags">{block:Tags}&nbsp;<a href="{TagURL}" title="{Tag}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}</div> &nbsp;
  1138.  
  1139. <br><br><br><br>
  1140. </div>
  1141. </div>
  1142.  
  1143. {/block:Posts}
  1144. <div class="notecontainer">
  1145. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1146. </div></div>
  1147. {/block:Posts}
  1148.  
  1149. </div>
  1150.  
  1151.  
  1152.  
  1153.  
  1154.  
  1155. </html>
Advertisement
Add Comment
Please, Sign In to add comment