lollyracket

wilderness - story page

Dec 12th, 2020
19
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2.  
  3. <head>
  4. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  5. <link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&display=swap" rel="stylesheet">
  6. <link href="https://fonts.googleapis.com/css?family=Be+Vietnam&display=swap" rel="stylesheet">
  7. <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet">
  8.  
  9.  
  10. <style type="text/css">
  11. /* -- credits
  12. code was made by lollyracketcodes. please do not copy or frankenstein.
  13.  
  14. honyebee icon font is credit to suiomi
  15.  
  16. --*/
  17.  
  18. #credit { position:fixed; right:20px; bottom:30px; padding:10px; font-size:9px; text-transform:uppercase; background-color:#f5f5f5; border:1px solid #ccc; }
  19. #credit icon { padding:5px; font-size:20px; }
  20. #credit:hover { transition-duration:1.2s; transition-timing-function:ease-in; font-weight:900; background-color:#a6dfb0; border:1px solid #a6dfb0; }
  21.  
  22.  
  23. body { font-family:be vietnam; font-size:10px; background-image:url(https://img.nickpic.host/FTmLQe.png); }
  24. body a { text-decoration:none; color:#000; }
  25.  
  26. ::-webkit-scrollbar {
  27. width: 5px;
  28. }
  29. ::-webkit-scrollbar-track {
  30. background:transparent;
  31. }
  32. ::-webkit-scrollbar-thumb {
  33. background: #888;
  34. }
  35.  
  36. /*--- fonts --*/
  37.  
  38. @font-face { font-family: 'altairthin'; src: url(https://files.jcink.net/uploads/sofewcares/Altair_Thin_Trial.ttf); }
  39. @font-face { font-family: 'altairbold'; src: url(https://files.jcink.net/uploads/sofewcares/Altair_Bold_Trial.ttf); }
  40.  
  41.  
  42. #wilderone { width:700px; background-color:#f5f5f5; border:1px solid #ccc; padding:10px; margin:40px auto auto auto; position:relative; }
  43. #wilderone .inside { padding:10px; background-color:#fff; border:1px solid #ccc; }
  44.  
  45. #wilderone .fillerbox { width:60px; padding:5px; border:1px solid transparent; }
  46.  
  47. #wilderone .linkside { position:absolute; top:0px; bottom:0px; left:0px; padding:10px; background-color:#8cbe9f; }
  48. #wilderone .bigbox { padding:10px; text-align:center; font-family:altairbold; font-size:12px; }
  49. #wilderone .biglink { padding:10px; font-size:30px; text-align:center; }
  50. #wilderone .bigbox a:hover { color:#fff; transition:0.7s ease-in-out; }
  51.  
  52. #wilderone .secondbod { width:420px; padding:10px; text-align:center; }
  53. #wilderone .secondtitle { font-family:altairbold; font-size:35px; padding:10px; margin-bottom:40px; margin-top:40px; }
  54. #wilderone .secondtry { background: linear-gradient(180deg,rgba(255,255,255,0) 60%, #a4a8d1 60%); }
  55. #wilderone .secondinfo { width:400px; font-size:11px; padding:10px; text-align:justify; font-family:be vietnam; }
  56. #wilderone .secondinfo u { text-decoration-style:wavy; text-decoration-color:#8cabbe; }
  57. #wilderone .secondinfo i { border-bottom:1px dashed #000; color:#a4a8d1; }
  58. #wilderone .secondinfo b { background-color:#bba0b2; padding:2px; }
  59. #wilderone .infodos { max-height:50px; padding:10px; overflow:auto; }
  60.  
  61. #wilderone .charover { padding:5px; height:145px; overflow:auto; text-align:center; }
  62. #wilderone .charhead { font-family:altairthin; text-align:left; font-size:15px; font-style:italic; margin:30px; color:#bba0b2; }
  63. #wilderone .charcolor { background: linear-gradient(180deg,rgba(255,255,255,0) 60%, #bba0b2 60%); }
  64. #wilderone .charbox { width:80px; padding:20px; text-align:center; }
  65. #wilderone .charimg { width:60px; height:60px; border-radius:100%; padding:5px; border:1px dashed #a4a8d1; }
  66. #wilderone .charimg img { width:60px; height:60px; background-size:cover; border-radius:100%; }
  67. #wilderone .charname { margin-top:10px; font-family:altairthin; font-size:11px; }
  68. #wilderone .charname a:hover { color:#bba0b2; letter-spacing:2px; transition:0.8s ease-in-out; }
  69.  
  70. #wilderone .thirdbox { width:135px; height:465px; padding:5px; margin-left:5px; border:1px dashed #8cabbe; }
  71. #wilderone .thirdbox img { width:135px; height:465px; background-size:cover; }
  72.  
  73. </style>
  74.  
  75.  
  76. </head>
  77.  
  78. <body>
  79. <div id="credit"><a href="https://lollyracketcodes.tumblr.com/"><icon><span class="th th-moon-o" title="page credit to lollyracketcodes"></span></icon></a></div>
  80.  
  81. <div id="wilderone">
  82. <div class="linkside">
  83. <center>
  84.  
  85. <div class="bigbox"><a href="//"><div class="biglink"><span class="th th-apple-o"></span></div>link</a></div>
  86. <div class="bigbox"><a href="//"><div class="biglink"><span class="th th-avocado-o"></span></div>link</a></div>
  87. <div class="bigbox"><a href="//"><div class="biglink"><span class="th th-bacon-o"></span></div>link</a></div>
  88. <div class="bigbox"><a href="//"><div class="biglink"><span class="th th-bagel-o"></span></div>link</a></div>
  89. <div class="bigbox"><a href="//"><div class="biglink"><span class="th th-baguette-o"></span></div>link</a></div>
  90. <div class="bigbox"><a href="//"><div class="biglink"><span class="th th-biscuit-o"></span></div>link</a></div>
  91.  
  92. </center>
  93. </div>
  94. <div class="inside">
  95. <table><td><div class="fillerbox"></div></td>
  96. <td><div class="secondbod">
  97. <div class="secondtitle"><span class="secondtry">title</span></div>
  98. <div class="secondinfo"><div class="infodos">
  99. story info here
  100. </div></div>
  101. <div class="charhead">characters</div>
  102. <div class="charover"><center>
  103. <table><tr>
  104. <td><div class="charbox"><div class="charimg"><img src="http://placehold.it/60"></div><div class="charname"><a href="//">name</a></div></div>
  105. </td>
  106. <td><div class="charbox"><div class="charimg"><img src="http://placehold.it/60"></div><div class="charname"><a href="//">name</a></div></div>
  107. </td>
  108. <td><div class="charbox"><div class="charimg"><img src="http://placehold.it/60"></div><div class="charname"><a href="//">name</a></div></div>
  109. </td>
  110. </tr>
  111.  
  112. </table></center>
  113. </div></td><td>
  114. <div class="thirdbox">
  115. <img src="http://placehold.it/135x465">
  116. </div></td>
  117. </table>
  118. </div>
  119. </div>
  120. </div>
  121.  
  122.  
  123. </body>
  124.  
  125. </html>
RAW Paste Data