Advertisement
silverrainresources

Starbcrn 170622 Layout

Jun 23rd, 2017
130
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.53 KB | None | 0 0
  1. <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
  2. <link href="https://fonts.googleapis.com/css?family=Jim+Nightshade" rel="stylesheet">
  3. <link href="https://fonts.googleapis.com/css?family=Metamorphous" rel="stylesheet">
  4.  
  5. <html>
  6. <!--
  7. I'd live to give a big shout out to http://fratdadbase.tumblr.com/ for this base code. Couldn't have done this without their help
  8.  
  9. STARXBCRN THEMES
  10. ⚜ this code was made by starxbcrn.tumblr.com
  11. ⚜ do not remove credit or claim as your own.
  12. ⚜ feel free to send me an ask if you have any questions
  13.  
  14. -->
  15.  
  16.  
  17.  
  18. <head>
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22. {block:Description}
  23. <meta name="description" content="{MetaDescription}" />
  24. <meta name="image:Background" content="" />
  25. {/block:Description}
  26.  
  27.  
  28. <!--
  29. POP UP SCRIPT
  30. -->
  31.  
  32.  
  33. <script type="text/javascript"
  34. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  35. <script>
  36. $(document).ready(function() {
  37. //
  38. $('a.poplight[href^=#]').click(function() {
  39. var popID = $(this).attr('rel'); //Get Popup Name
  40. var popURL = $(this).attr('href'); //Get Popup href to define size
  41. var query= popURL.split('?');
  42. var dim= query[1].split('&');
  43. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  44. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close">');
  45. var popMargTop = ($('#' + popID).height() + 80) / 2;
  46. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  47. //Apply Margin to Popup
  48. $('#' + popID).css({
  49. 'margin-top' : -popMargTop,
  50. 'margin-left' : -popMargLeft
  51. });
  52. $('body').append('<div id="fade"></div>');
  53. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  54. return false;
  55. });
  56. $('a.close, #fade').live('click', function() {
  57. $('#fade , .popup_block').fadeOut(function() {
  58. $('#fade, a.close').remove(); //fade them both out
  59. });
  60. return false;
  61. });
  62. });
  63. </script>
  64.  
  65.  
  66.  
  67.  
  68.  
  69.  
  70.  
  71. <!--
  72. TOOLTIP STYLING SCRIPT
  73. -->
  74.  
  75.  
  76. <link href="http://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  77. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  78. <script src="http://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  79. <script>
  80. (function($){
  81. $(document).ready(function(){
  82. $("[title]").style_my_tooltips({
  83. tip_follows_cursor:true,
  84. tip_delay_time:200,
  85. tip_fade_speed:500
  86. });
  87. });
  88. })(jQuery);
  89. </script>
  90.  
  91. <!--
  92. VERSE TABS SCRIPT
  93. -->
  94.  
  95. <script>
  96. $(document).ready(function(){
  97. $("ul#tabs li").click(function(e){
  98. if (!$(this).hasClass("active")) {
  99. var tabNum = $(this).index();
  100. var nthChild = tabNum+1;
  101. $("ul#tabs li.active").removeClass("active");
  102. $(this).addClass("active");
  103. $("ul#tab li.active").removeClass("active");
  104. $("ul#tab li:nth-child("+nthChild+")").addClass("active");
  105. }
  106. });
  107. });
  108. </script>
  109.  
  110.  
  111.  
  112. <script type="text/javascript">
  113. var sc_project=11351508;
  114. var sc_invisible=1;
  115. var sc_security="92d8efba";
  116. var scJsHost = (("https:" == document.location.protocol) ?
  117. "https://secure." : "http://www.");
  118. document.write("<sc"+"ript type='text/javascript' src='" +
  119. scJsHost+
  120. "statcounter.com/counter/counter.js'></"+"script>");
  121. </script>
  122. <noscript><div class="statcounter"><a title="free hit
  123. counter" href="http://statcounter.com/" target="_blank"><img
  124. class="statcounter"
  125. src="//c.statcounter.com/11351508/0/92d8efba/1/" alt="free
  126. hit counter"></a></div></noscript>
  127.  
  128.  
  129.  
  130. <!--
  131. ANNALYTICS
  132. -->
  133. <script>
  134. (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  135. (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  136. m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  137. })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
  138.  
  139. ga('create', 'UA-99795215-1', 'auto');
  140. ga('send', 'pageview');
  141.  
  142. </script>
  143.  
  144. </head>
  145.  
  146. <style type="text/css">
  147.  
  148.  
  149.  
  150. ::-webkit-scrollbar {
  151. width: 2px;
  152. height: 2px;
  153. }
  154. ::-webkit-scrollbar-button {
  155. width: 0px;
  156. height: 0px;
  157. }
  158. ::-webkit-scrollbar-thumb {
  159. background: transparent;
  160. border: 0px none #ffffff;
  161. border-radius: 50px;
  162. }
  163. ::-webkit-scrollbar-thumb:hover {
  164. background: transparent;
  165. }
  166. ::-webkit-scrollbar-thumb:active {
  167. background: transparent;
  168. }
  169. ::-webkit-scrollbar-track {
  170. background: transparent;
  171. border: 0px none #ffffff;
  172. border-radius: 0px;
  173. }
  174. ::-webkit-scrollbar-track:hover {
  175. background:transparent;
  176. }
  177. ::-webkit-scrollbar-track:active {
  178. background: transparent;
  179. }
  180. ::-webkit-scrollbar-corner {
  181. background: transparent;
  182. }
  183.  
  184. body {
  185. background-color:#101010;
  186. background-image:url("http://i.imgur.com/wWx0Vk4.png");
  187. background-repeat: no-repeat;
  188. font-family:calibri;
  189. font-size: 11px;
  190. text-align: justify;
  191. color:#fff;
  192. }
  193.  
  194.  
  195.  
  196. /*ASK AND ANSWERS */
  197.  
  198. #askerurl {
  199. font-family: courier;
  200. text-transform:uppercase;
  201. font-weight:400;
  202. font-size:12px;
  203. margin-top:0px;
  204. margin-left:90px;
  205. padding-bottom:5px;
  206. width:400px;}
  207.  
  208. #question {
  209. background-attachment:fixed;
  210. padding:2px 7px;
  211. margin:3px 0 3px 10px;
  212. border-left:3px solid #989c82;
  213. border-right:3px solid #989c82;
  214. background-color:#27667e;
  215. color: #989c82;
  216. -webkit-border-radius: 10px;
  217. }
  218.  
  219. #answer {
  220. letter-spacing: 2px;
  221. word-spacing: 3px;
  222. }
  223.  
  224.  
  225.  
  226. /*a59e88 AND POSTS*/
  227.  
  228. #a59e88 {
  229. background-color:transparent;
  230. width:260px;
  231. height:550px;
  232. padding: 20px;
  233. top:60px;
  234. margin-left: 455px;
  235. position:relative;
  236. overflow-y:scroll;
  237. overflow-x:hidden;
  238. -webkit-filter: blur(0px) ; -webkit-transition: 0.4s ease-in;
  239. -moz-transition: 0.4s ease-in; transition: 0.4s ease-in;
  240. -webkit-mask-image: -webkit-gradient(
  241. linear, center 75%, center bottom,
  242. from(rgba(0,0,0,20)),
  243. to(rgba(20,0,0,0)))
  244. }
  245.  
  246. #a59e88 img {
  247. height:auto;
  248. max-width:100%;
  249. }
  250.  
  251. #content {
  252. margin-left:62px;
  253. width:310px;
  254. margin-top: -110px;
  255. }
  256.  
  257. #posts {
  258. width:255px;
  259. padding:10px;
  260. margin-top: 90px;
  261. margin-left:-72px;
  262. padding-bottom:0px;
  263. overflow-y:scroll;
  264. overflow-x:hidden;
  265. }
  266.  
  267.  
  268. #description {
  269. margin-left: 0px;
  270. margin-top: -50px;
  271. width:180px;
  272. color:transparent;}
  273.  
  274.  
  275. .nav {
  276. position: fixed;
  277. top: 140px;
  278. width: 230px;
  279. height:150px;
  280. margin-left: 290px;
  281. overflow: none;
  282. background-color: transparent;
  283. }
  284.  
  285. .rules {
  286. position: fixed;
  287. top: 50px;
  288. left: 50px;
  289. width: auto;
  290. height: auto;
  291. -ms-transform: rotate(7deg); /* IE 9 */
  292. -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */
  293. transform: rotate(7deg);
  294. }
  295.  
  296. .ask {
  297. position: fixed;
  298. top: 25px;
  299. left: 100px;
  300. width: auto;
  301. height: auto;
  302. -ms-transform: rotate(-27deg); /* IE 9 */
  303. -webkit-transform: rotate(-27deg); /* Chrome, Safari, Opera */
  304. transform: rotate(-27deg);
  305. }
  306.  
  307. .navigation {
  308. position: fixed;
  309. top: 75px;
  310. left: 125px;
  311. width: auto;
  312. height: auto;
  313. -ms-transform: rotate(20deg); /* IE 9 */
  314. -webkit-transform: rotate(20deg); /* Chrome, Safari, Opera */
  315. transform: rotate(20deg);
  316. }
  317.  
  318. .verses {
  319. position: fixed;
  320. top: 125px;
  321. left: 50px;
  322. width: auto;
  323. height: auto;
  324. -ms-transform: rotate(-12deg); /* IE 9 */
  325. -webkit-transform: rotate(-12deg); /* Chrome, Safari, Opera */
  326. transform: rotate(-12deg);
  327. }
  328.  
  329.  
  330.  
  331.  
  332. /*FANCY FONT*/
  333.  
  334. h1{
  335. font-family: 'Cinzel', serif;
  336. color:#292a37;
  337. background-color: #d0ffff;
  338. font-size: 20px;
  339. text-shadow:1px 1px 1px #94d6ba;
  340. text-align: center;
  341. text-transform: uppercase;
  342.  
  343. font-weight: normal;
  344. line-height: 21px;
  345. }
  346.  
  347. h2{
  348. font-family: 'Cinzel', serif;
  349. color:#a59e88;
  350. background-color:;
  351. font-size: 20px;
  352. text-align: right;
  353. text-transform: uppercase;
  354. border-right: 20px solid #a59e88;
  355. font-weight: normal;
  356. line-height: 21px;
  357. letter-spacing: 2px;
  358. }
  359.  
  360. h3{
  361. font-family: consolas;
  362. color:#1e3c3d;
  363. font-size; 6px;
  364. text-shadow:1px 1px #ffffff;
  365. }
  366.  
  367.  
  368. h4 {
  369. background-image: url('http://68.media.tumblr.com/052575547d8f2d3d4b023461442da6ec/tumblr_nnqlgnnL8i1u3q9yxo1_500.jpg');
  370. background-repeat:repeat;
  371. background-attachment:fixed;
  372. border: double 3px #000;
  373. padding:2px;
  374. color:#939cab;
  375. overflow: auto;
  376. text-shadow:1px 1px 0px #000,
  377. font-size:15px;
  378. font-family:calibri;
  379. text-transform:uppercase;
  380. letter-spacing:1px;
  381. text-align:center;
  382. }
  383.  
  384. h5 {
  385. font-family:georgia;
  386. font-size:20px;
  387. font-weight:normal;
  388. text-align:center;
  389. color: #b1adb1;
  390. text-transform:lowercase;
  391. background-color:#032b2e;
  392. text-transform:lowercase;
  393. letter-spacing:-1px;
  394. padding-top:2px;
  395. padding-botton:-1px;
  396. padding: 1px;
  397. line-height:25px;
  398. margin:2px;
  399. border: 5px solid #3d4b56;}
  400.  
  401.  
  402.  
  403. h6 {
  404. font-family: consolas;
  405. font-size:8px;
  406. text-align:center;
  407. color:#b1adb1;
  408. background-color:#3d4b56;
  409. text-transform:uppercase;
  410. margin:1px;
  411. letter-spacing:7px;
  412. line-height:10px;
  413. -webkit-border-bottom-right-radius: 50px;
  414. -webkit-border-bottom-left-radius: 50px;
  415. -moz-border-radius-bottomright: 50px;
  416. -moz-border-radius-bottomleft: 50px;
  417. border-bottom-right-radius: 50px;
  418. border-bottom-left-radius: 50px;}
  419.  
  420.  
  421.  
  422.  
  423. b {
  424. font-family: 'Inconsolata', monospace;
  425. color: #678389;
  426. font-size: 12px;
  427. letter-spacing: 2px;
  428. text-transform: uppercase;
  429. }
  430.  
  431. i {
  432. font: 20px georgia;
  433. font-style: italic;
  434. text-transform: uppercase;
  435. text-shadow:1px 1px 1px #ffffff;
  436. color: #a59e88;}
  437.  
  438. p {
  439. margin-top:5px;
  440. margin-bottom:5px;}
  441.  
  442.  
  443. ol {
  444. list-style:normal;}
  445.  
  446.  
  447. ul {
  448. list-style:square;}
  449.  
  450.  
  451. small {
  452. font-size:10px}
  453.  
  454.  
  455. sup,sub {
  456. font-size:11px}
  457.  
  458.  
  459. pre {
  460. font-size: 10px;
  461. letter-spacing:3px;
  462. background-color:#a59e88;
  463. font-family: "Times New Roman", Times, serif;
  464. font-style: none;
  465. text-align:center;
  466. }
  467.  
  468.  
  469.  
  470. big {
  471. font-size:14px;
  472. text-transform:uppercase;
  473. letter-spacing:2px;
  474. font-family: "Times New Roman", Times, serif;
  475. color: #4a132c;
  476. text-shadow: 0px 0px 2px #93345f;
  477. }
  478.  
  479. blockquote {
  480. padding:2px 7px;
  481. padding-right:17px;
  482. margin:3px 0 3px 10px;
  483. border-left:3px solid #59592d;
  484. -webkit-border-radius: 30px;
  485. }
  486.  
  487.  
  488. blockquote img{
  489. max-width:100%;
  490. height:auto;
  491. }
  492.  
  493. blockquote blockquote img{
  494. max-width:100%;
  495. height:auto;
  496. }
  497.  
  498. t, title {
  499. size: 15px;
  500. color: 222;
  501. letter-spacing: 2px;
  502. font: times;
  503. }
  504.  
  505.  
  506. /*LINKS*/
  507.  
  508. a:link, a:active, a:visited {
  509. text-decoration: none;
  510. color: #3c7788;
  511. text-transform: uppercase;
  512. font-family: 'Metamorphous', cursive;
  513. font-size: 12px;
  514. -moz-transition-duration:.6s;
  515. -webkit-transition-duration:.6s;
  516. -o-transition-duration:.6s;
  517. -webkit-filter: blur(0px);}
  518.  
  519. a:hover {
  520. color: #8f8f8f;
  521. font-family: 'Metamorphous', cursive;
  522. letter-spacing: 2px;
  523. -moz-transition-duration:.6s;
  524. -webkit-transition-duration:.6s;
  525. -o-transition-duration:.6s;
  526. -webkit-filter: blur(1px);}
  527.  
  528.  
  529. a.second, a.second:link, a.second:active, a.second:visited {
  530. font-family:consolas;
  531. font-size:8px;
  532. line-height:8pt;
  533. letter-spacing:0px;
  534. color:#d4cec3;
  535. text-shadow:0px 0px 7px #7f7f7f;
  536. text-decoration:none;
  537. text-transform:uppercase;
  538. letter-spacing:0px;
  539. background-color:#74c2ad;
  540. text-align:center;
  541. display:block;
  542. margin:1px 0px 3px 0px;
  543. -webkit-transition: all 0.4s ease-out;
  544. -moz-transition: all 0.4s ease-out;
  545. transition: all 0.4s ease-out;
  546. -moz-transition-duration: 0.4s;
  547. -webkit-transition-duration: 0.4s;
  548. -o-transition-duration: 0.4s;
  549. transition-duration: 0.4s;}
  550.  
  551. a.second:hover {
  552. font-family:consolas;
  553. font-style: bold;
  554. font-size:8px;
  555. line-height:8pt;
  556. letter-spacing:2px;
  557. font-weight:normal;
  558. color:#9b968c;
  559. background-color: #91f2d8;
  560. text-decoration:none;
  561. text-transform:uppercase;
  562. text-shadow:2px 2px #000000;
  563. background-color: #2a100c;
  564. text-align:center;
  565. display:block;
  566. margin:1px 0px 3px 0px;
  567. -moz-transition-duration: 0.4s;
  568. -webkit-transition-duration: 0.4s;
  569. -o-transition-duration: 0.4s;
  570. transition-duration: 0.4s;
  571. }
  572.  
  573.  
  574. a.third, a.third:link, a.third:active, a.third:visited {
  575. font-family:consolas;
  576. font-size:10px;
  577. line-height:10pt;
  578. letter-spacing:0px;
  579. color:#ffffff;
  580. text-decoration:none;
  581. text-transform:uppercase;
  582. letter-spacing:0px;
  583. background-color:#485257;
  584. border: 5px solid #485257;
  585. margin: 2px;
  586. text-align:center;
  587. text-shadow:4px 0px transparent;
  588. display:inline-block;
  589. -webkit-transition: all 0.4s ease-out;
  590. -moz-transition: all 0.4s ease-out;
  591. transition: all 0.4s ease-out;
  592. -moz-transition-duration: 0.4s;
  593. -webkit-transition-duration: 0.4s;
  594. -o-transition-duration: 0.4s;
  595. transition-duration: 0.4s;}
  596.  
  597. a.third:hover {
  598. font-family:consolas;
  599. font-style: bold;
  600. font-size:10px;
  601. line-height:10pt;
  602. letter-spacing:2px;
  603. font-weight:normal;
  604. color:#ffffff;
  605. text-decoration:none;
  606. text-transform:uppercase;
  607. text-shadow:2px 2px #000000;
  608. text-align:center;
  609. display:inline-block;
  610. -moz-transition-duration: 0.4s;
  611. -webkit-transition-duration: 0.4s;
  612. -o-transition-duration: 0.4s;
  613. transition-duration: 0.4s;
  614. }
  615.  
  616.  
  617. a.fourth, a.fourth:link, a.fourth:active, a.fourth:visited {
  618. font-family:consolas;
  619. font-size:12px;
  620. line-height:12pt;
  621. letter-spacing:0px;
  622. color:#222;
  623. text-decoration:none;
  624. text-transform:uppercase;
  625. letter-spacing:0px;
  626. background-color:#a59e88;
  627. text-align:center;
  628. text-shadow:4px 0px transparent;
  629. display:inline-block;
  630. margin:1px 0px 3px 0px;
  631. -webkit-border-radius: 30px;
  632. -webkit-transition: all 0.4s ease-out;
  633. -moz-transition: all 0.4s ease-out;
  634. transition: all 0.4s ease-out;
  635. -moz-transition-duration: 0.4s;
  636. -webkit-transition-duration: 0.4s;
  637. -o-transition-duration: 0.4s;
  638. transition-duration: 0.4s;}
  639.  
  640. a.fourth:hover {
  641. font-family:consolas;
  642. font-style: bold;
  643. font-size:12px;
  644. line-height:12pt;
  645. letter-spacing:2px;
  646. font-weight:normal;
  647. color:#222222;
  648. text-decoration:none;
  649. text-transform:uppercase;
  650. text-shadow:2px 2px #000000;
  651. background-color:#e7e7dd;
  652. text-align:center;
  653. display:inline-block;
  654. margin:1px 0px 3px 0px;
  655. -webkit-border-radius: 30px;
  656. -moz-transition-duration: 0.4s;
  657. -webkit-transition-duration: 0.4s;
  658. -o-transition-duration: 0.4s;
  659. transition-duration: 0.4s;
  660. }
  661.  
  662.  
  663.  
  664. .pagination {
  665. position:fixed;
  666. top: 570px;
  667. left: 300px;
  668. height: 100px;
  669. width: 100px;
  670. text-align:center;
  671. }
  672. #navlinks {
  673. text-align:center;
  674. margin-top:10px;
  675. font-size:13px;
  676. }
  677. #navlinks a {
  678. color:{color:link colour};
  679. }
  680.  
  681.  
  682.  
  683.  
  684.  
  685.  
  686. /* POST INFO AND TAGS */
  687.  
  688.  
  689. #infobox {
  690. border:1px solid transparent;
  691. margin-bottom:0px;
  692. padding-top:10px;
  693. }
  694.  
  695.  
  696. #info {
  697. margin-left:20px;
  698. background-color: #81897e;
  699. border-top: 10px solid #81897e;
  700. height: 15px;
  701. margin-bottom: 75px;
  702. margin-left: -2px;
  703. border-radius: 5px;
  704. opacity: 0.5;
  705. }
  706.  
  707. #info a {
  708. color:#0e412c;
  709. text-shadow: 0px 0px 10px #3d3e41;
  710. opacity: 1;
  711. }
  712.  
  713. #info a:hover {
  714. color:transparent;
  715. opacity: 1;
  716. }
  717.  
  718.  
  719. #tags {
  720. width:250px;
  721. padding:10px;
  722. font-size:7px;
  723. text-align:justify;
  724. font-family:arial;
  725. text-transform:uppercase;
  726. background:transparent;
  727. border-bottom:1px solid #474747;
  728. margin-bottom: 30px;
  729. }
  730.  
  731.  
  732. #tags a {
  733. font-family:consolas;
  734. font-size:8px;
  735. line-height:8pt;
  736. letter-spacing:0px;
  737. color:#d4cec3;
  738. text-shadow:0px 0px 7px #7f7f7f;
  739. text-decoration:none;
  740. text-transform:uppercase;
  741. text-align:center;
  742. display:inline-block;
  743. margin:1px 0px 3px 0px;
  744. -webkit-border-radius: 30px;
  745. -webkit-transition: all 0.4s ease-out;
  746. -moz-transition: all 0.4s ease-out;
  747. transition: all 0.4s ease-out;
  748. -moz-transition-duration: 0.4s;
  749. -webkit-transition-duration: 0.4s;
  750. -o-transition-duration: 0.4s;
  751. transition-duration: 0.4s; }
  752.  
  753.  
  754. #tags a:hover {
  755. color:#555;
  756. text-shadow:0px 0px 1px #777;
  757. -webkit-filter:none;
  758. -webkit-transition: all 0.6s ease-in-out;
  759. opacity:1;
  760. -webkit-transition: all 0.6s ease-in-out;
  761. -moz-transition: all 0.6s ease-in-out;
  762. -o-transition: all 0.6s ease-in-out;
  763. -ms-transition: all 0.6s ease-in-out;
  764. transition: all 0.6s ease-in-out;
  765. }
  766.  
  767.  
  768.  
  769.  
  770. /* MISC 02. */
  771.  
  772.  
  773.  
  774. .note {
  775. text-transform:uppercase;
  776. font-style:normal;
  777. letter-spacing:0px;
  778. font-size: 10px;
  779. text-align:left;
  780. line-height:90%;
  781. margin-left:-40px;}
  782.  
  783. .note li {
  784. list-style-type:none;
  785. border-bottom:0px solid {color:border};
  786. padding:10px 25px 10px 25px;
  787. text-align:left;
  788. margin:0px;
  789. -moz-transition-duration:0.5s;
  790. -webkit-transition-duration:0.5s;
  791. -o-transition-duration:0.5s;}
  792.  
  793. .note img.avatar {
  794. margin-right: 10px;
  795. width: 16px;
  796. height: 16px;}
  797.  
  798.  
  799.  
  800. /* BASIC POP-UP DETAILS */
  801.  
  802.  
  803. /*--Making IE6 Understand Fixed Positioning--*/
  804. *html #fade {
  805. position: absolute;
  806. }
  807. *html .popup_block {
  808. position: absolute;
  809. }
  810.  
  811. .popup_block{
  812. display: none; /*--hidden by default--*/
  813. background: transparent;
  814. padding: 20px;
  815. border: 0px solid #000; /*color of the border of the popup box*/
  816. float: left;
  817. font-size: 12px; /*font size of the words inside the box */
  818. position: fixed;
  819. top: 350px; left:700px;
  820. z-index: 99999; /*if the box is hiding behind other things in your theme, add more 9′s */
  821. }
  822.  
  823.  
  824. #fade { /*--Transparent background layer--*/
  825. display: none; /*--hidden by default--*/
  826. background: #fff;
  827. background-image: url('https://i.imgbox.com/g13gZc0R.gif'); /*if you want to add a background image to go behind your popup */
  828. position: fixed; left: 0; top: 0;
  829. width: 100%; height: 100%;
  830. opacity: 1.0;
  831. z-index: 9999;
  832. }
  833.  
  834.  
  835. .popupnavlinks {
  836. padding-top:5px;
  837. text-align:center; }
  838.  
  839.  
  840. .popupnavlinks a {
  841. display:inline-block;
  842. width:90px; height:4px;
  843. margin:2px; padding:3px 6px 10px;
  844. text-align:center;
  845. background-image: url('');
  846. background:#a59e88;
  847. background-repeat:repeat;
  848. background-attachment:fixed;
  849. border: double 3px #000;
  850. color:#000000;
  851. font-size:9px;
  852. font-family:calibri;
  853. text-shadow:1px 1px 0px #000,
  854. display: inline-block;
  855. cursor: pointer;
  856. }
  857.  
  858. .popupnavlinks a:hover {
  859. display:inline-block;
  860. letter-spacing:2px;
  861. border-radius: 46px 10px 58px 0px;
  862. -moz-border-radius: 46px 10px 58px 0px;
  863. -webkit-border-radius: 46px 10px 58px 0px;
  864. -moz-transition-duration: 0.4s;
  865. -webkit-transition-duration: 0.4s;
  866. -o-transition-duration: 0.4s;
  867. transition-duration: 0.4s;
  868. }
  869.  
  870.  
  871.  
  872. .popupclose {
  873. float:right; top:0px; right:0px;
  874. margin-top:-10px; margin-right:-10px;
  875. font-family:'Scada', sans serif;
  876. font-size:10px;
  877. font-weight:bold }
  878.  
  879. .popupclose a {
  880. color:#aaa }
  881.  
  882. /* TOOLTIP DETAILS */
  883.  
  884.  
  885.  
  886. #s-m-t-tooltip{
  887. max-width:400px;
  888. margin:15px;
  889. padding:2px 8px;
  890. background: #1c0915;
  891. background-image:url('http://68.media.tumblr.com/052575547d8f2d3d4b023461442da6ec/tumblr_nnqlgnnL8i1u3q9yxo1_500.jpg');
  892. background-repeat:repeat;
  893. background-attachment:fixed;
  894. border: double 3px #000;
  895. color:#fff;
  896. text-shadow:1px 1px 0px #000,
  897. z-index:99999999999999999999;
  898. font-size:9px;
  899. letter-spacing:2px;
  900. font-style:bold;
  901. letter-spacing:2px;
  902. font-family: calibri;
  903. text-transform:uppercase;
  904. box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  905.  
  906.  
  907.  
  908. /*VERSES TABS*/
  909.  
  910.  
  911. ul#tabs {
  912. list-style-type: none;
  913. padding: 0;
  914. text-align: center;
  915. }
  916. ul#tabs li {
  917. display: inline-block;
  918. background-color: #222222;
  919. padding: 5px 20px;
  920. margin-bottom: 4px;
  921. color: #fff;
  922. cursor: pointer;
  923. }
  924. ul#tabs li:hover {
  925. background-color: #000000;
  926. }
  927. ul#tabs li.active {
  928. background-color: #000000;
  929. }
  930. ul#tab {
  931. list-style-type: none;
  932. margin: 0;
  933. padding: 0;
  934. }
  935. ul#tab li {
  936. display: none;
  937. }
  938. ul#tab li.active {
  939. display: block;
  940. }
  941.  
  942.  
  943.  
  944.  
  945.  
  946. /*CREDIT*/
  947.  
  948. .credit {
  949. position:fixed;
  950. text-shadow: 0px 0px 11px #fff;
  951. right:15px;
  952. bottom:15px;
  953. transform: rotate(0deg);
  954. font-family: helvetica;
  955. font-size: 14px; }
  956.  
  957.  
  958. .credit a {
  959. padding:10px;
  960. color:#fff;
  961. margin-right:0px;
  962. -webkit-filter: blur(1px);
  963. -webkit-transition: 0.8s ease-in;
  964. -moz-transition: 1s ease-in;
  965. transition: 1s ease-in;
  966. }
  967.  
  968. .credit a:hover {
  969. -webkit-transition: all 0.6s ease-in-out;
  970. -moz-transition: all 0.6s ease-in-out;
  971. -o-transition: all 0.6s ease-in-out;
  972. -ms-transition: all 0.6s ease-in-out;
  973. transition: all 0.6s ease-in-out;
  974. color: #000000;
  975. text-shadow: 2px 2px 2px #000000;
  976. }
  977.  
  978. </style>
  979.  
  980. <body>
  981.  
  982.  
  983.  
  984. <script type="text/javascript" src="http://bpmaker.giffy.me/userdata/user/53/53959/2/parts.js"></script>
  985.  
  986. <div class="rules">
  987. <a href="/r" class="third" title="rules">Rules</a>
  988. </div>
  989. <div class="ask">
  990. <a href="/ask" class="third" title="ask">Transmit</a>
  991. </div>
  992.  
  993. <div class="navigation">
  994. <a href="/n" class="third" title="navigation">Star Chart</a>
  995. </div>
  996.  
  997. <div class="verses">
  998. <a href="/v" class="third" title="verses">Alternate Realities</a>
  999. </div>
  1000.  
  1001.  
  1002. <div class="pagination">{block:Pagination}
  1003. {block:PreviousPage}<a href="{PreviousPage}" class="fourth">☚</a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" class="fourth">☛</a>
  1004. {/block:NextPage}
  1005. {/block:Pagination}</div>
  1006.  
  1007. <div id="a59e88">
  1008.  
  1009. {block:Posts}
  1010.  
  1011. <div class="posts">
  1012.  
  1013. {block:Text}{block:Title}{Title}{/block:Title}{Body}{/block:Text}
  1014.  
  1015. {block:Photo}<img src="{PhotoURL-250}" alt="{PhotoAlt}"/>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  1016.  
  1017. {block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Panorama}
  1018.  
  1019. {block:Photoset}{Photoset-250}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1020.  
  1021. {block:Quote}"{Quote}"{block:Source}{Source}{/block:Source}{/block:Quote}
  1022.  
  1023. {block:Link}<a href="{URL}" class="link" {Target}>{Name}</a>{block:Description}{Description}{/block:Description}{/block:Link}
  1024.  
  1025. {block:Chat}{block:Title}{Title}</a>{/block:Title}
  1026. {block:Lines}<li>{block:Label}{Label}{/block:Label}{Line}</li>{/block:Lines}{/block:Chat}
  1027.  
  1028. {block:Video}{Video-250}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  1029.  
  1030. {block:Audio}{AudioEmbed}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  1031.  
  1032. {block:Answer}
  1033.  
  1034. <div id="askerurl" style="margin-left:100px; margin-top:-0px; color:#5a7478; font-size:13px; text-transform:uppercase; text-align:left; word-wrap: break-word;">{asker}</div><div style="max-width:100px; margin-left:100px; margin-top:0px; letter-spacing:2px; word-spacing: 1px; text-align:justify;">SENT A TRANSMISSION</div>
  1035.  
  1036. <div id="question" style="margin-top: 20px">{Question}</div>
  1037. <div id="answer" style="margin-top: 20px;">{Answer}</div>{/block:Answer}
  1038.  
  1039.  
  1040. <!--
  1041. INFO AND SYMBOLS
  1042. -->
  1043.  
  1044. <div id="infobox">
  1045. <div id="info">
  1046. <br>
  1047.  
  1048. &nbsp; &nbsp;
  1049.  
  1050.  
  1051. {block:Date}
  1052. <a href="{Permalink}"style="position:absolute; width: autopx; margin-left:10px; margin-top:-17px; font-size: 9px; font-family: 'Pacifico', cursive;" title="{TimeAgo} ">{ShortMonth} {DayOfMonthWithZero} &nbsp;&nbsp;●</a>
  1053. {/block:Date}
  1054.  
  1055. <a href="{Permalink}" style="position:absolute; margin-left: 70px; margin-top:-13px; font-size: 9px; line-height:100%; width:auto; font-family: 'Pacifico', cursive;" title=" {NoteCount}"> notes &nbsp;● </a>
  1056.  
  1057.  
  1058. <a href="{ReblogURL}" style="position:absolute; margin-left:130px; margin-top:-16px; font-size:9px; font-family: 'Pacifico', cursive;" title="reblog"> Repost &nbsp;● </a>
  1059.  
  1060. {block:ContentSource}
  1061. <a href="{SourceURL}" style="position:absolute; margin-left:195px; margin-top:-16px; font-size:9px; font-family: 'Pacifico', cursive;" title=" source. {SourceTitle} "> via</a>
  1062. {/block:ContentSource}
  1063.  
  1064. {block:RebloggedFrom}
  1065. <a href="{ReblogParentURL}" style="position:absolute; margin-left:-30px; margin-top:40px; color: #76858b" title=" via. {ReblogParentName} "> ☄ </a>
  1066. {/block:RebloggedFrom}
  1067.  
  1068. <br>
  1069.  
  1070.  
  1071. <!--
  1072. INFO AND SYMBOLS ENDS
  1073. -->
  1074.  
  1075.  
  1076. {block:HasTags}<div id="tags">{block:Tags}&nbsp;<a href="{TagURL}" title="{Tag}">☆ {Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1077. </div>&nbsp;
  1078.  
  1079. <br><br><br><br>
  1080.  
  1081. {/block:Posts}
  1082. <div class="note">
  1083. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1084. </div></div>
  1085.  
  1086. {/block:Posts}
  1087.  
  1088. </div>
  1089. </body>
  1090.  
  1091.  
  1092. <!--
  1093. ♛ POP UP PAGES !!!
  1094. -->
  1095.  
  1096.  
  1097. <div id="box2" class="popup_block">
  1098.  
  1099. <div style="width:auto;height:375px;overflow:auto;padding:5px;">
  1100.  
  1101.  
  1102. <h2>LAWS OF SPACE</h2>
  1103.  
  1104. <p>
  1105. <h4>The Mun</h4>
  1106. <B>1.</B> Sara (mun) is 24 years old. Adult content, NSFW and mature themes will happen here.
  1107.  
  1108. <p><b>2.</b> This is a selective and mutuals only blog. Meaning, I follow who I want to write with and I writhe only with those who follow me back. This is so I can keep tabs on all of my writing and who my writing partners are.
  1109.  
  1110. <p><b>3.</b> I love to have an ooc connection with my roleplay partner. So feel free to pop into my inbox and talk with me ooc. It can be about anything. Your day, our plots, our ships, our muses, questions. Anything.
  1111.  
  1112. <p>For mutuals, you can always chat with me ooc on skype: soundofxsilence || do ic chitchat/plots on discord: captainiissm#4010 || or find me on kik: silencexwillxfall . Again, this is for mutuals only.
  1113.  
  1114. <h4>Writing and Threads</h4>
  1115.  
  1116. <p><b>4.</b> It doesn’t take much to get a thread going. Feel free to send a meme or tag me in a starter or shoot me a message to discuss a plot. Whatever tickles your fancy, let me know.
  1117.  
  1118. <p><b>4b.</b> I also enjoy multiple threads. So, if you wanna turn a meme into a rp or just do multiple plots, I am totally game.
  1119.  
  1120. <p><b>5.</b> While I do still stand with the above rules, I am also looking for world building, longer plots, and relationship building. Those kind of stories I think work the best. And the fun part about that? Other threads can stem off the original thread we have going and we can explore more.
  1121.  
  1122. <p><b>6.</b> Threads can be as long or a short as you would like. If I write a long paragraph and you do half a paragraph, that's fine. I write with where my muse takes me and how well the story seems to flow. I do ask that you at least progress the storyline forward so my muse has something to respond to.
  1123.  
  1124. <p><b>7.</b> If at anytime you have an idea or question during our thread, feel free to shoot me a message. My inbox is always open. I love adding more depth to our threads.
  1125.  
  1126. <p><b>8.</b> I do have a thread tracker but this will be used for plotted threads only. I hold a priority over those.
  1127.  
  1128. <p><b>9.</b> For my sanity, sometimes I will have to drop threads. A majority of the threads that will be dropped are random, unplotted, short threads. While I love those kinds of threads, again, I'd love to focus on the plotted threads.
  1129.  
  1130. <p>
  1131. <h4>Shipping & Mains</h4>
  1132.  
  1133. <p><b>10.</b> I ship Jim with <i>CHEMISTRY</i> and he is pansexual. This is also a multi-ship and multi-verse blog.
  1134.  
  1135. <p><b>11.</b> If we find that our muses click really well and you'd like to ship, please feel free to let me know. I'll do the same. I'm a really easy going mun. But please don't be upset if I say no.
  1136.  
  1137. <p><b>12.</b> <i>Smut</i> will be on this blog. I have no problem writing it with any of the <b>muses I ship with or have a potential to ship with</b>. If my writing partner is not comfortable with writing public smut, we can fade to black. I will always accommodate my writing partner. Personally, I have no problem writing out detailed sex scenes.
  1138.  
  1139. <p><b>13.</b> I do have a mains banner/call floating around. I hate to add rules and stipulations to it, but I've noticed a lot of people go poof or on hiatus with little to no notice.
  1140.  
  1141. <p>If I don't see you on my dash for a long while or I go to your blog and see that you've been inactive, I will remove you from my mains list. It's nothing against you, I just like to keep things as simple as possible. If you happen to come back from your blog and would like to be mains again, I have no problem added you back on to my list.
  1142.  
  1143. <p><b>14.</b>Being my main means you get priority replies, I will make you pretty things or tag you in pretty things. I would hope that you'd also extend me the same courtesy. I.E. I am one of your mains/shipping partners and everything else stated above.
  1144.  
  1145.  
  1146.  
  1147. <h4>MISC</h4>
  1148.  
  1149. <p><b>15.</b> All graphics will be made by me. Please do not take them. Also, please don't take my graphical concept ideas. If you really like something, just ask if you can model your own graphics after mine. It's rude and uncalled for. I don't mind helping you out if you need it.
  1150.  
  1151. <p>All coding was done by me/tutorials on tumblr. Please do not take any of my coding or remove credit from the base code I have offered for the role play community. Again, if you'd like to model your blog after mine, please <b>ASK.</b> Chances are I will say yes.
  1152.  
  1153. <p><b>16.</b> I don’t really tag anything except for a few. Mostly NSFW related things. If you have a problem or would like something tagged, please let me know and I will try to accommodate you.
  1154.  
  1155. <p><b>17.</b> My other blogs: <a href="http://spacemomx.tumblr.com">Winona Kirk</a> && <a href="http://wanhedaxkomxskaikru.tumblr.com">Clarke Griffin</a> && <a href="http://whispersinspace.tumblr.com">Nitara Uhrtia</a>
  1156.  
  1157. </div>
  1158. </div>
  1159.  
  1160.  
  1161. <div id="box3" class="popup_block">
  1162.  
  1163. <div style="width:auto;height:375px;overflow:auto;padding:5px;">
  1164.  
  1165. <center>
  1166.  
  1167. <h6>NAVIGATION</h6>
  1168.  
  1169.  
  1170. <div class="popupnavlinks">
  1171. <a href="/tagged/m: meme ★・。WHO IS JIM KIRK">MEMES</a>
  1172. <a href="/tagged/t: open thread ★・。 CAN ANYONE HEAR ME">OPEN THREADS</a>
  1173. <br>
  1174. <a href="/tagged/h: headcanon ★・。PEOPLE HAVE AN IDEA OF WHO I AM BUT THEY DON’T KNOW ME">HEADCANONS</a>
  1175. <a href="/tagged/w: wishlist ★・。INCOMING TRANSMISSION">WISHLIST</a>
  1176. <BR>
  1177. <p><h6>The Kirks</h6>
  1178. <a href="/tagged/a: face ★・。MISTER PERFECT HAIR">MUSE</a>
  1179. <a href="/tagged/a: space ★・。THIS IS MY HOME">SPACE</a>
  1180. <br>
  1181. <a href="/tagged/a: crew ★・。THIS IS MY FAMILY">CREW</a>
  1182. <a href="/tagged/a: earth ★・。SILENT BEAUTY">EARTH</a>
  1183. <br>
  1184. <a href="/tagged/a: kirks ★・。TOUGH LOVE">FAMILY</a>
  1185. <a href="/tagged/WHATEVER">LINK</a>
  1186. <p><h6>Characters & Ships</h6>
  1187. <a href="/tagged/c: bones ★・。HYPO IN THE NECK">BONES</a>
  1188. <a href="/tagged/c: spock ★・。LIVE LONG AND PROSPER MY FRIEND">SPOCK</a>
  1189. <br>
  1190. <a href="/tagged/c: jaylah ★・。LADY AFTER MY OWN HEART">JAYLAH</a>
  1191. <a href="/tagged/c: uhura ★・。WILL YOU TELL ME YOUR FIRST NAME">UHURA</a>
  1192. <br>
  1193. <a href="/tagged/c: khan ★・。SUPERHUMAN PAIN IN MY ASS">KHAN</a>
  1194. <a href="/tagged/s: spirk ★・。HOW CAN ONE LIVE WITHOUT THE OTHER">SPIRK</a>
  1195. <br>
  1196. <a href="/tagged/s: spones ★・。DOUBLE TEAM">SPONES</a>
  1197. <a href="/tagged/s: mckirk ★・。JABBER JAWS">MCKIRK</a>
  1198. <br>
  1199. <a href="/tagged/s: mcspirk ★・。HYPO JABBING UNSOUND LOGIC">MCSPIRK</a>
  1200. <a href="/tagged/s: khirk ★・。ALLURING POWER">KHIRK</a>
  1201. <p><h6>Keep Sakes</h6>
  1202. <a href="/tagged/m: memories ★・。SAVING HOLOPICS">MEMORIES</a>
  1203. <a href="/tagged/whatever">LINK</a>
  1204. <br>
  1205. <br>
  1206. <p><h6>FOR YOU</h6>
  1207. <a href="http://starxbcrn-a.tumblr.com/post/157511333495/oh-man-where-do-i-even-start-with-this-first">BASE CODE 1</a>
  1208. <a href="http://starxbcrn-a.tumblr.com/post/161281615365/i-think-i-finally-have-enough-deck-hands-to-crew">BASE CODE 2</a>
  1209. <br>
  1210. <a href="http://beyondtheseah.tumblr.com/post/161299797684/hey-hey-hey-im-excited-to-announce-that-i-am">COMMISSIONS</a>
  1211.  
  1212.  
  1213.  
  1214. <br><br><br>
  1215.  
  1216.  
  1217. </div>
  1218.  
  1219. </div></div>
  1220.  
  1221. <!--
  1222. VERSES STARTS
  1223. -->
  1224.  
  1225. <div id="box4" class="popup_block">
  1226.  
  1227. <div style="width:auto; height: 375px; overflow:auto;padding:5px;">
  1228.  
  1229. <ul id="tabs">
  1230. <li class="active">Tab 1</li>
  1231. <li>Tab 2</li>
  1232. <li>Tab 3</li>
  1233. <li>Tab 4</li>
  1234. <li>Tab 5</li>
  1235. </ul>
  1236. <ul id="tab">
  1237. <li class="active">
  1238. <h2>This is the first tab</h2>
  1239. </li>
  1240. <li>
  1241. <h2>This is the second tab</h2>
  1242. </li>
  1243. <li>
  1244. <h2>Tab number three wee hee</h2>
  1245. </li>
  1246. <li>
  1247. <h2>Fourth tab not bad</h2>
  1248. </li>
  1249. <li>
  1250. <h2>Tab number five here we go!</h2>
  1251. </li>
  1252. </ul>
  1253. </div>
  1254. </div>
  1255. <!--
  1256. VERSES ENDS
  1257. -->
  1258.  
  1259. <div id="box5" class="popup_block">
  1260.  
  1261. <div style="width:auto;height:375px;overflow:scroll;padding:5px;">
  1262. <h4>Mains</h4>
  1263. <p><b>pointyxearedbastard</b>
  1264. <br>- Spock ★
  1265. <img src="https://i.imgbox.com/6kSIRX5Z.png">
  1266. <p><b>fcrestmaiden</b>
  1267. <br>- Tauriel ★
  1268. <img src="https://i.imgbox.com/0VCzi9R1.png">
  1269. <p><b>blkwidow</b>
  1270. <br>- Natasha Romanoff ★
  1271. <img src="https://i.imgbox.com/6tDLoq5I.png">
  1272. <p><b>blondehairbluesweater</b>
  1273. <br>- Raleigh Beckett ★
  1274. <img src="https://i.imgbox.com/YHYsnr8N.png">
  1275. <p><b>heathiins</b>
  1276. <br>- Inga ★
  1277. <br><img src="https://i.imgbox.com/82sMxV3R.png">
  1278. <p><b>snowinabottle</b>
  1279. <br>- Amelia ★
  1280. <img src="https://i.imgbox.com/ziu4VH5R.png">
  1281. <p><b>atomiism</b>
  1282. <br>- Ray Palmer ★
  1283. <img src="https://i.imgbox.com/vlC0xa0P.png">
  1284. <p><b>friendoftheood</b>
  1285. <br>- Rose Tyler ★
  1286. <img src="https://i.imgbox.com/sJKG860Q.png">
  1287. <p><b>astrohistoria</b>
  1288. <br>- Mika ★
  1289. <br><img src="https://i.imgbox.com/V84whoUS.png">
  1290. <p><b>starrysouffles</b>
  1291. <br>- Clara Oswald ★
  1292. <img src="https://i.imgbox.com/LDI3kFag.png">
  1293. <p><b>thewailer</b>
  1294. <br>- Lydia Martin ★
  1295. <img src="https://i.imgbox.com/zd4B864x.png">
  1296. <p><b>pottsceo</b>
  1297. <br>- Pepper Potts ★ **
  1298. <img src="https://i.imgbox.com/PJPfVG5L.png">
  1299. <p><b>hellfireandhightops</b>
  1300. <br>- Maka ★
  1301. <br><img src="https://i.imgbox.com/Gkh1a67c.png">
  1302.  
  1303. <p>
  1304. <p>★ denotes a shipping partner
  1305. <br> ** denotes exclusives
  1306.  
  1307. </div></div>
  1308.  
  1309. <div class="credit">
  1310. <a href="http://starxbcrn.tumblr.com/" title="starxbcrn">C.</a>
  1311. </div>
  1312. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement