API tools faq
paste
Advertisement
repth

Theme 38

repth
May 28th, 2022
1,004
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.16 KB | None | 0 0
raw download clone embed print report
  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 38</title>
  7.  
  8. <link rel="preconnect" href="https://fonts.googleapis.com">
  9. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  10. <link href="https://fonts.googleapis.com/css2?family=Crete+Round&display=swap" rel="stylesheet">
  11.  
  12. <style>
  13.  
  14. body{
  15. background-color: #c5ccc2;
  16. margin-bottom: 2%;
  17. color: #5c6358;
  18. font-family: 'Crete Round', serif;
  19. }
  20.  
  21. #all{
  22. width: 60%;
  23. margin: 0 auto;
  24. }
  25.  
  26. #header{
  27. width: 99.8%;
  28. height: 150px;
  29. border-top: 1px solid #6e756a;
  30. border-left: 1px solid #6e756a;
  31. border-right: 1px solid #6e756a;
  32. border-bottom: 0px;
  33. border-radius: 35px 35px 0px 0px;
  34. background-color: #d2dfcd;
  35. background-image: url('https://i.imgur.com/nqXa1s6.png');
  36. background-position: center center;
  37. background-repeat: repeat;
  38. display: flex;
  39. align-items: center;
  40. justify-content: center;
  41. }
  42.  
  43. #title{
  44. margin: 0;
  45. text-align: center;
  46. color: #FDD33F;
  47. text-shadow: 0px 0px 1px #000041;
  48. }
  49.  
  50. #navbox{
  51. margin: 0px 0px 20px 0px;
  52. width: 100%;
  53. background-image: linear-gradient(to right, #d2dfcd,#e9efe6,#d2dfcd);
  54. }
  55.  
  56. #navbox ul{
  57. margin: 0;
  58. padding: 10px;
  59. text-align: center;
  60. border: 1px solid #6e756a;
  61. }
  62.  
  63. #navbox li{
  64. list-style-type: none;
  65. display: inline;
  66. font-size: 19px;
  67. margin: 10px;
  68. }
  69.  
  70. .main{
  71. width: 100%;
  72. }
  73.  
  74. .post{
  75. width: 100%;
  76. }
  77.  
  78. .text{
  79. width: 84%;
  80. padding: 25px;
  81. border: 1px solid #6e756a;
  82. margin-bottom: 20px;
  83. background-color: #d2dfcd;
  84. }
  85.  
  86. .textborder{
  87. background-color: #e9efe6;
  88. border: 1px dashed #6e756a;
  89. padding: 20px;
  90. font-size: 15px;
  91. }
  92.  
  93. .subheaders{
  94. margin: 0;
  95. font-weight: normal;
  96. font-size: 20px;
  97. }
  98.  
  99. .date{
  100. margin: 0;
  101. font-size: 13px;
  102. }
  103.  
  104. .icon{
  105. float: right;
  106. margin-top: 13px;
  107. margin-left: 10px;
  108. width: 125px;
  109. border: 1px solid #6e756a;
  110. }
  111.  
  112. a{
  113. color: #E79D44;
  114. text-decoration: none;
  115. }
  116.  
  117. a:visited{
  118. color: #E79D44;
  119. text-decoration: none;
  120. }
  121.  
  122. a:hover{
  123. font-weight: bold;
  124. }
  125.  
  126. a:active{
  127. font-weight: normal;
  128. }
  129.  
  130. #credit a{
  131. color: #fff;
  132. }
  133.  
  134. ::-webkit-scrollbar{
  135. width: 6px;
  136. }
  137.  
  138. ::-webkit-scrollbar-track{
  139. background-color: transparent;
  140. }
  141.  
  142. ::-webkit-scrollbar-thumb{
  143. background-color: #E79D44;
  144. }
  145.  
  146. #credit{
  147. font-size: 11px;
  148. position: fixed;
  149. bottom: 0;
  150. right: 0;
  151. }
  152.  
  153. </style>
  154.  
  155. </head>
  156.  
  157. <body>
  158.  
  159. <div id="all">
  160. <div id="header"><h1 id="title">Title Here</h1></div>
  161. <div id="navbox">
  162. <ul>
  163. <li><a href="URL HERE">home</a></li>
  164. <li><a href="URL HERE">about</a></li>
  165. <li><a href="URL HERE">gallery</a></li>
  166. <li><a href="URL HERE">blog</a></li>
  167. <li><a href="URL HERE">projects</a></li>
  168. <li><a href="URL HERE">links</a></li>
  169. <li><a href="URL HERE">other</a></li>
  170. </ul>
  171. </div>
  172.  
  173. <div id="main">
  174.  
  175. <div class="post">
  176.  
  177. <!-- ENTRY START -->
  178. <!-- ICON -->
  179. <img class="icon" src="https://i.imgur.com/uoq5FWg.png">
  180.  
  181. <div class="text">
  182. <div class="textborder">
  183. <!-- ENTRY HEADER -->
  184. <h2 class="subheaders">Header Here</h2>
  185. <p class="date">5/28/2022</p>
  186. <!-- ENTRY TEXT -->
  187. <p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse finibus lorem enim, vel pretium urna vehicula eu. Curabitur pharetra tellus id nunc rutrum condimentum. Donec non erat eget purus consectetur semper quis ut turpis. Curabitur nulla justo, gravida vehicula finibus in, ornare et nunc. Praesent eleifend neque nunc, fringilla fringilla tellus molestie vel. Curabitur arcu massa, pulvinar ut hendrerit eu, tincidunt ac lacus. Sed ut semper magna. Suspendisse facilisis leo sit amet erat pulvinar, vitae bibendum augue tempus. Donec aliquet maximus libero, vel fermentum quam maximus in. Quisque mi leo, bibendum eu libero sed, pharetra auctor sem. Donec tempus justo venenatis dui semper finibus. Donec vestibulum felis non tortor facilisis, at fringilla dolor scelerisque. Quisque eros eros, rutrum et tempus at, condimentum ac nulla.</p>
  188.  
  189. <p>Nullam ut dictum urna, id accumsan elit. Maecenas vitae vestibulum elit. Nam dui massa, convallis sit amet ligula vel, convallis feugiat felis. Mauris sollicitudin lectus sed nunc tempus, non feugiat elit iaculis. Donec mattis odio vel eros volutpat, vitae blandit nunc elementum. Nulla enim odio, iaculis sollicitudin lorem a, maximus tincidunt lorem. Donec tempor, elit at porta sodales, nunc nulla blandit turpis, at dapibus magna enim ut purus. Integer et faucibus metus. Duis nunc dui, vulputate id leo in, sollicitudin imperdiet odio. Praesent ac congue massa, ut mattis sem. Nunc a consectetur diam, id tristique dolor.</p>
  190. </div>
  191. </div>
  192. <!-- ENTRY END -->
  193.  
  194. <!-- ENTRY START -->
  195. <!-- ICON -->
  196. <img class="icon" src="https://i.imgur.com/uoq5FWg.png">
  197.  
  198. <div class="text">
  199. <div class="textborder">
  200. <!-- ENTRY HEADER -->
  201. <h2 class="subheaders">Header Here</h2>
  202. <p class="date">5/28/2022</p>
  203. <!-- ENTRY TEXT -->
  204. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse finibus lorem enim, vel pretium urna vehicula eu. Curabitur pharetra tellus id nunc rutrum condimentum. Donec non erat eget purus consectetur semper quis ut turpis. Curabitur nulla justo, gravida vehicula finibus in, ornare et nunc. Praesent eleifend neque nunc, fringilla fringilla tellus molestie vel. Curabitur arcu massa, pulvinar ut hendrerit eu, tincidunt ac lacus. Sed ut semper magna. Suspendisse facilisis leo sit amet erat pulvinar, vitae bibendum augue tempus. Donec aliquet maximus libero, vel fermentum quam maximus in. Quisque mi leo, bibendum eu libero sed, pharetra auctor sem. Donec tempus justo venenatis dui semper finibus. Donec vestibulum felis non tortor facilisis, at fringilla dolor scelerisque. Quisque eros eros, rutrum et tempus at, condimentum ac nulla.</p>
  205.  
  206. <p>Nullam ut dictum urna, id accumsan elit. Maecenas vitae vestibulum elit. Nam dui massa, convallis sit amet ligula vel, convallis feugiat felis. Mauris sollicitudin lectus sed nunc tempus, non feugiat elit iaculis. Donec mattis odio vel eros volutpat, vitae blandit nunc elementum. Nulla enim odio, iaculis sollicitudin lorem a, maximus tincidunt lorem. Donec tempor, elit at porta sodales, nunc nulla blandit turpis, at dapibus magna enim ut purus. Integer et faucibus metus. Duis nunc dui, vulputate id leo in, sollicitudin imperdiet odio. Praesent ac congue massa, ut mattis sem. Nunc a consectetur diam, id tristique dolor.</p>
  207. </div>
  208. </div>
  209. <!-- ENTRY END -->
  210.  
  211. <!-- ENTRY START -->
  212. <!-- ICON -->
  213. <img class="icon" src="https://i.imgur.com/uoq5FWg.png">
  214.  
  215. <div class="text">
  216. <div class="textborder">
  217. <!-- ENTRY HEADER -->
  218. <h2 class="subheaders">Header Here</h2>
  219. <p class="date">5/28/2022</p>
  220. <!-- ENTRY TEXT -->
  221. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse finibus lorem enim, vel pretium urna vehicula eu. Curabitur pharetra tellus id nunc rutrum condimentum. Donec non erat eget purus consectetur semper quis ut turpis. Curabitur nulla justo, gravida vehicula finibus in, ornare et nunc. Praesent eleifend neque nunc, fringilla fringilla tellus molestie vel. Curabitur arcu massa, pulvinar ut hendrerit eu, tincidunt ac lacus. Sed ut semper magna. Suspendisse facilisis leo sit amet erat pulvinar, vitae bibendum augue tempus. Donec aliquet maximus libero, vel fermentum quam maximus in. Quisque mi leo, bibendum eu libero sed, pharetra auctor sem. Donec tempus justo venenatis dui semper finibus. Donec vestibulum felis non tortor facilisis, at fringilla dolor scelerisque. Quisque eros eros, rutrum et tempus at, condimentum ac nulla.</p>
  222.  
  223. <p>Nullam ut dictum urna, id accumsan elit. Maecenas vitae vestibulum elit. Nam dui massa, convallis sit amet ligula vel, convallis feugiat felis. Mauris sollicitudin lectus sed nunc tempus, non feugiat elit iaculis. Donec mattis odio vel eros volutpat, vitae blandit nunc elementum. Nulla enim odio, iaculis sollicitudin lorem a, maximus tincidunt lorem. Donec tempor, elit at porta sodales, nunc nulla blandit turpis, at dapibus magna enim ut purus. Integer et faucibus metus. Duis nunc dui, vulputate id leo in, sollicitudin imperdiet odio. Praesent ac congue massa, ut mattis sem. Nunc a consectetur diam, id tristique dolor.</p>
  224. </div>
  225. </div>
  226. <!-- ENTRY END -->
  227.  
  228. </div>
  229. </div>
  230.  
  231.  
  232. </div>
  233.  
  234. <div id="credit"><a href="https://repth.neocities.org/index.html">©repth</a></div>
  235.  
  236. </body>
  237.  
  238. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!