Advertisement
repth

themeb

Jan 10th, 2022
1,182
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.65 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>theme</title>
  7.  
  8. <style>
  9.  
  10. body{
  11. background-color: #CBC3C1;
  12. background-image: url('');
  13. color: #363538;
  14. }
  15.  
  16. #all{
  17. background-color: #ccc;
  18. width: 615px;
  19. margin: 0 auto;
  20. }
  21.  
  22. #side{
  23. background-color: #fff;
  24. float: left;
  25. width: 175px;
  26. position: fixed;
  27. }
  28.  
  29. #sidepadding{
  30. padding: 10px;
  31. }
  32.  
  33. .sideimgholder{
  34. display: flex;
  35. justify-content: center;
  36. align-items: center;
  37. opacity: 0.7;
  38. }
  39.  
  40. #sideimg{
  41. width: 175px;
  42. }
  43.  
  44. #nav{
  45. font-size: 14px;
  46. padding: 5px 0px 5px 0px;
  47. }
  48.  
  49. ul{
  50. margin: 0px;
  51. padding-left: 0px;
  52. width: 175px;
  53. -webkit-column-count: 2;
  54. -moz-column-count: 2;
  55. column-count: 2;
  56. }
  57.  
  58. li{
  59. list-style-type:;
  60. width: 71px;
  61. display: inline;
  62. float: left;
  63. }
  64.  
  65. #sidecontent{
  66. font-size: 13px;
  67. text-align: justify;
  68. }
  69.  
  70. .divider{
  71. border-top: 1px dotted #7A787D;
  72. }
  73.  
  74. #main{
  75. background-color: #fff;
  76. float: right;
  77. width: 425px;
  78. }
  79.  
  80. .subheaders{
  81. margin: 0px;
  82. font-weight: normal;
  83. letter-spacing: 2px;
  84. font-size: 20px;
  85. line-height: 13px;
  86. color: #fff;
  87. background-color: #7A787D;
  88. }
  89.  
  90. .maincontent{
  91. padding: 0px 15px 15px 15px;
  92. text-align: justify;
  93. font-size: 14px;
  94. letter-spacing: 1px;
  95. }
  96.  
  97. a{
  98. text-decoration: none;
  99. color: #BA7F61;
  100. }
  101.  
  102. a:visited{
  103. color: #BA7F61;
  104. }
  105.  
  106. a:hover{
  107. font-style: italic;
  108. }
  109.  
  110. a:active{
  111. font-weight: bold;
  112. }
  113.  
  114. ::-webkit-scrollbar{
  115. width: 8px;
  116. }
  117.  
  118. ::-webkit-scrollbar-track{
  119. background-color: transparent;
  120. }
  121.  
  122. ::-webkit-scrollbar-thumb{
  123. background-color: #7A787D;
  124. }
  125.  
  126. #credit{
  127. font-size: 12px;
  128. position: fixed;
  129. bottom: 0;
  130. right: 0;
  131. }
  132.  
  133. </style>
  134.  
  135. </head>
  136.  
  137. <body>
  138.  
  139. <div id="all">
  140.  
  141. <div id="side">
  142. <h2 class="subheaders">header here</h2>
  143.  
  144. <div id="sidepadding">
  145.  
  146. <div class="sideimgholder">
  147. <img id="sideimg" src="https://i.imgur.com/bExQthf.gif">
  148. </div>
  149.  
  150. <div id="nav">
  151. <ul>
  152. <li><a href="">home</a></li>
  153. <li><a href="">about</a></li>
  154. <li><a href="">gallery</a></li>
  155. <li><a href="">blog</a></li>
  156. <li><a href="">links</a></li>
  157. <li><a href="">misc</a></li>
  158. </ul>
  159. </div>
  160.  
  161. <div class="divider"></div>
  162.  
  163. <div id="sidecontent">
  164. <p style="margin-top:5px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus odio et neque varius dapibus. Praesent laoreet ipsum.</p>
  165.  
  166. <div class="sideimgholder">
  167. <img src="https://i.imgur.com/1dEdQoa.gif">
  168. </div>
  169.  
  170. </div>
  171. </div>
  172. </div>
  173.  
  174. <div id="main">
  175. <h2 class="subheaders">header here</h2>
  176.  
  177. <div class="maincontent">
  178. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus odio et neque varius dapibus. Praesent laoreet ipsum nec urna malesuada, quis auctor lorem sagittis. Suspendisse semper nisl vitae ligula varius malesuada. Aenean consequat libero risus, nec rutrum felis tincidunt sed. Nullam non metus in neque vehicula convallis vitae et est. Fusce eleifend leo ut urna vulputate</p>
  179.  
  180. <p>Maecenas a leo sed neque dapibus lobortis. Vestibulum ornare est in fermentum lacinia. Curabitur ut consectetur risus. Donec consectetur lorem eget mauris facilisis, ut tempor dui congue. In nunc.</p>
  181.  
  182. <p>Phasellus luctus elementum sagittis. Sed id blandit nisl. Vivamus volutpat consequat condimentum. Curabitur sit amet eros urna. Curabitur vitae eros elementum, iaculis ipsum eu, tempus massa. Nullam turpis metus, mollis non mi sit amet, ultrices pharetra orci.</p>
  183.  
  184. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus odio et neque varius dapibus. Praesent laoreet ipsum nec urna malesuada, quis auctor lorem sagittis. Suspendisse semper nisl vitae ligula varius malesuada. Aenean consequat libero risus, nec rutrum felis tincidunt sed. Nullam non metus in neque vehicula convallis vitae et est. Fusce eleifend leo ut urna vulputate</p>
  185.  
  186. <p>Maecenas a leo sed neque dapibus lobortis. Vestibulum ornare est in fermentum lacinia. Curabitur ut consectetur risus. Donec consectetur lorem eget mauris facilisis, ut tempor dui congue. In nunc.</p>
  187.  
  188. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus odio et neque varius dapibus. Praesent laoreet ipsum nec urna malesuada, quis auctor lorem sagittis. Suspendisse semper nisl vitae ligula varius malesuada. Aenean consequat libero risus, nec rutrum felis tincidunt sed. Nullam non metus in neque vehicula convallis vitae et est. Fusce eleifend leo ut urna vulputate</p>
  189.  
  190. <p>Maecenas a leo sed neque dapibus lobortis. Vestibulum ornare est in fermentum lacinia. Curabitur ut consectetur risus. Donec consectetur lorem eget mauris facilisis, ut tempor dui congue. In nunc.</p>
  191. </div>
  192.  
  193. </div>
  194. </div>
  195.  
  196. <div id="credit"><a href="https://repth.neocities.org/index.html">©repth</a></div>
  197.  
  198. </body>
  199.  
  200. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement