folkdances

STRAWBERRY DREAMS

Mar 11th, 2024
532
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.46 KB | Source Code | 0 0
  1. <!--
  2. DO NOT REMOVE CREDITS, PLEASE!
  3. CREDIT: Coded by @folkdances on Tumblr
  4. CREDIT: Some graphics from foollovers
  5.  
  6. CODING GUIDE:
  7.  
  8. CTRL+F Lorem ipsum to find the places to input text. CTRL+F img src to find images. Play around in the CSS to change appearence and HTML to change content.
  9.  
  10. QUICK CODES:
  11.  
  12. <img src=""> for images.
  13. <li></li> for bullet points.
  14. <a href="URL">TEXT</a> for links.
  15.  
  16.  
  17. Reach out if you need any help!
  18. -->
  19.  
  20. <html>
  21.  
  22. <!--METADATA-->
  23.  
  24. <meta charset="utf-8" />
  25.  
  26. <head>
  27.  
  28. <title>april fool</title>
  29. <link rel="icon" href="https://foollovers.com/mat/i-s-twset/ccf03-icon-rabbit.gif">
  30.  
  31. <style>
  32. @import url('https://fonts.googleapis.com/css2?family=Mountains+of+Christmas:wght@400;700&display=swap')
  33. </style>
  34.  
  35. <style>
  36. @import url('https://fonts.googleapis.com/css2?family=Emilys+Candy&family=Mountains+of+Christmas:wght@400;700&display=swap')
  37. </style>
  38.  
  39. </head>
  40.  
  41. <!--CSS CONTENT-->
  42.  
  43. <style>
  44.  
  45. ::-webkit-scrollbar {
  46. width: 16px;
  47. }
  48. ::-webkit-scrollbar:horizontal {
  49. height: 17px;
  50. }
  51.  
  52. ::-webkit-scrollbar-corner {
  53. background: #dfdfdf;
  54. }
  55.  
  56. ::-webkit-scrollbar-track {
  57. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='2' height='2' viewBox='0 0 2 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 0H0V1H1V2H2V1H1V0Z' fill='%23C0C0C0'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 0H1V1H0V2H1V1H2V0Z' fill='white'/%3E %3C/svg%3E");
  58. }
  59.  
  60. ::-webkit-scrollbar-thumb {
  61. background-color: #dfdfdf;
  62. box-shadow: inset -1px -1px #0a0a0a,
  63. inset 1px 1px #ffffff, inset -2px -2px #808080,
  64. inset 2px 2px #dfdfdf;
  65. }
  66.  
  67. ::-webkit-scrollbar-button:vertical:start {
  68. height: 17px;
  69. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0V1V16H1V1H15V0Z' fill='%23DFDFDF'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1V15H2V2H14V1H2Z' fill='white'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H15H0V16H15V0H16V17Z' fill='black'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1H14V15H1V16H14H15V1Z' fill='%23808080'/%3E %3Crect x='2' y='2' width='12' height='13' fill='%23C0C0C0'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 6H7V7H6V8H5V9H4V10H11V9H10V8H9V7H8V6Z' fill='black'/%3E %3C/svg%3E");
  70. }
  71.  
  72. ::-webkit-scrollbar-button:vertical:end {
  73. height: 17px;
  74. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0V1V16H1V1H15V0Z' fill='%23DFDFDF'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1V15H2V2H14V1H2Z' fill='white'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H15H0V16H15V0H16V17Z' fill='black'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1H14V15H1V16H14H15V1Z' fill='%23808080'/%3E %3Crect x='2' y='2' width='12' height='13' fill='%23C0C0C0'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 6H4V7H5V8H6V9H7V10H8V9H9V8H10V7H11V6Z' fill='black'/%3E %3C/svg%3E");
  75. }
  76.  
  77. ::-webkit-scrollbar-button:horizontal:start {
  78. width: 16px;
  79. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0V1V16H1V1H15V0Z' fill='%23DFDFDF'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1V15H2V2H14V1H2Z' fill='white'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H15H0V16H15V0H16V17Z' fill='black'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1H14V15H1V16H14H15V1Z' fill='%23808080'/%3E %3Crect x='2' y='2' width='12' height='13' fill='%23C0C0C0'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 4H8V5H7V6H6V7H5V8H6V9H7V10H8V11H9V4Z' fill='black'/%3E %3C/svg%3E");
  80. }
  81.  
  82. ::-webkit-scrollbar-button:horizontal:end {
  83. width: 16px;
  84. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0V1V16H1V1H15V0Z' fill='%23DFDFDF'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1V15H2V2H14V1H2Z' fill='white'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H15H0V16H15V0H16V17Z' fill='black'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1H14V15H1V16H14H15V1Z' fill='%23808080'/%3E %3Crect x='2' y='2' width='12' height='13' fill='%23C0C0C0'/%3E %3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 4H6V11H7V10H8V9H9V8H10V7H9V6H8V5H7V4Z' fill='black'/%3E %3C/svg%3E");
  85. }
  86.  
  87. @font-face{
  88. font-family: m;
  89. src: url(https://dl.dropbox.com/s/y0um53c5m3g66dn/mamemoji.ttf?);
  90. }
  91.  
  92. .mountains-of christmas-regular {
  93. font-family: "Mountains of Christmas", serif;
  94. font-weight: 400;
  95. font-style: normal;
  96. }
  97.  
  98. .emilys-candy-regular {
  99. font-family: "Emilys Candy", serif;
  100. font-weight: 400;
  101. font-style: normal;
  102. }
  103.  
  104.  
  105. a {
  106. color: #41371A;
  107. }
  108.  
  109. html {
  110. background-image: url(https://foollovers.com/mat/plaid03/b01-bg-checked.gif);
  111. list-style-image: url(https://media.discordapp.net/attachments/796456985595084830/1216130892775424000/image_2024-03-09_160927205_resized.png?ex=65ff4527&is=65ecd027&hm=e27c18ea0d71a60ca51692a053857f318c2208097604ed07b2465d3686460ecc&=&format=webp&quality=lossless&width=12&height=15)
  112. }
  113.  
  114. .mainframe {
  115. background-image: url(https://foollovers.com/mat/samback/cloth10.png);
  116. width: 1000px;
  117. height: 930px;
  118. border-style: inset;
  119. border-width: 5px;
  120. border-color: orangered;
  121. border-radius: 5px 5px 5px 5px;
  122. }
  123.  
  124. .header {
  125. background-image: url(https://media.discordapp.net/attachments/796456985595084830/1216126953866661910/image.png?ex=65ff417c&is=65eccc7c&hm=31632151fd757f16b32b694a2d27bcdc410b4ed7363351b7c132e0b2445d2405&=&format=webp&quality=lossless&width=687&height=258);
  126. width: 1000px;
  127. height: 250px;
  128. background-position: right;
  129. background-size: cover;
  130. }
  131.  
  132. .leftsb {
  133. background-image: url(https://foollovers.com/mat/samback/cloth09.png);
  134. height: 680;
  135. width: 185px;
  136. float: left;
  137. text-align: justify;
  138. padding-left: 20px;
  139. font-family: m;
  140. font-size: 20px;
  141. border-right-style: double;
  142. border-color: #41371A;
  143. border-radius: 0 0 50px 0;
  144. padding-right: 10px;
  145. }
  146.  
  147. .main {
  148. background-image: url(https://foollovers.com/mat/samback/cloth09.png);
  149. width: 500px;
  150. height: 610px;
  151. float: left;
  152. padding: 10px;
  153. margin-left: 10px;
  154. margin-top: 40px;
  155. border-style: double;
  156. border-color: #41371A;
  157. text-align: justify;
  158. font-family: m;
  159. font-size: 20px;
  160. }
  161.  
  162. .title {
  163. font-family: "Emilys Candy", serif;
  164. font-size: 30px;
  165. margin-top: 5px;
  166. color: #D13A3F;
  167. letter-spacing: 5px;
  168. }
  169.  
  170. .marquee {
  171. position: absolute;
  172. margin-left: 220px;
  173. width: 778px;
  174. margin-top: 8px;
  175. }
  176.  
  177. .banners {
  178. background-image: url(https://foollovers.com/mat/plaid02/i18-bg-checked.gif);
  179. margin-left: -10px;
  180. border-radius: 0 50px 50px 0;
  181. font-family: "Mountains of Christmas", serif;
  182. padding: 10px;
  183. border-top-style: double;
  184. border-bottom-style: double;
  185. border-right-style: double;
  186. border-color: #41371A;
  187. text-align: center;
  188. }
  189.  
  190. </style>
  191.  
  192. <!--HTML CONTENT-->
  193.  
  194. <center>
  195. <div class="mainframe">
  196. <div class="header"></div>
  197. <div class="leftsb">
  198. <img src="https://foollovers.com/mat/menu06/61b-none.gif" style="width: 200px; margin-top:10px; margin-bottom: 10px; margin-left: -15px;">
  199.  
  200. <p style="margin-top: -60px; margin-left: 48px; font-family: Mountains of Christmas; color: #DAAC3C; font-size: 18px;">NAVIGATION</p>
  201.  
  202. <li><a href="URL">TITLE</a></li>
  203. <li><a href="URL">TITLE</a></li>
  204. <li><a href="URL">TITLE</a></li>
  205. <li><a href="URL">TITLE</a></li>
  206. <li><a href="URL">TITLE</a></li>
  207. <li><a href="URL">TITLE</a></li>
  208. <li><a href="URL">TITLE</a></li>
  209. <li><a href="URL">TITLE</a></li>
  210. <li><a href="URL">TITLE</a></li>
  211. <li><a href="URL">TITLE</a></li>
  212. <li><a href="URL">TITLE</a></li>
  213.  
  214. <img src="https://foollovers.com/mat/menu06/61b-none.gif" style="width: 200px; margin-top:10px; margin-bottom: 10px; margin-left: -15px;">
  215.  
  216. <p style="margin-top: -60px; margin-left: 48px; font-family: Mountains of Christmas; color: #DAAC3C; font-size: 18px;">Button 2!</p><br>
  217.  
  218. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  219.  
  220. </div>
  221. <div class="marquee">
  222. <marquee behavior="scroll" direction="left" scrollamount="6" onmouseover="this.stop();" onmouseout="this.start();">
  223. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  224. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  225. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  226. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  227. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  228. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  229. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  230. <img src="https://thumbs4.imagebam.com/3d/d1/b4/MEQV19D_t.gif">
  231. </marquee>
  232. </div>
  233. <div class="main">
  234. <div class="title">TITLE HERE <img src="https://foollovers.com/mat/i-s-twset/j03-icon-rabbit.gif" style="width: 25px;"></div></p><br>
  235.  
  236. <p style="margin-top: -40px; letter-spacing: 5px;"><b>Subtitle here!</b></p>
  237. <div class="banners">
  238.  
  239. WHAT IS THIS, EXACTLY?
  240.  
  241. </div>
  242. <br>
  243.  
  244. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
  245.  
  246. <br><br>
  247.  
  248. <div class="banners">
  249.  
  250. WHO RUNS THIS JOINT?
  251.  
  252. </div><br>
  253.  
  254. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
  255.  
  256. <br><br>
  257. </div>
  258. <img src="https://i.pinimg.com/564x/99/5f/e1/995fe1fdca953017cebae0308bf2c068.jpg" style="float: right; width: 230; margin-right: 10px; margin-top: 40px; margin-bottom: 10px;">
  259.  
  260. <img src="https://i.pinimg.com/564x/ad/81/86/ad8186c97b10989a63745312e787257d.jpg" style="width:100px;">
  261. <img src="https://i.pinimg.com/564x/d1/0f/ea/d10feaaf793b811b13940d404efed0ee.jpg" style="width:100px;">
  262. <img src="https://i.pinimg.com/564x/2a/71/d8/2a71d8aa9d8a3169ae80f0b4c3323127.jpg" style="width:100px;">
  263. <img src="https://i.pinimg.com/564x/a1/8c/a2/a18ca2a860737dc4b370a1f1fc3d3f23.jpg" style="width:100px;">
  264.  
  265. <!--CALENDAR-->
  266. <fieldset style="padding:0px;border:0;margin:0px;"><legend><a href="http://calendar-muryou.com/" style="color:hotpink;text-decoration: none;font-size:9pt;" target="_blank" rel="nofollow"></a></legend><iframe src="https://calendar.sakura.ne.jp/blog_cal.html" scrolling="no" style="background-color:#fbe;padding:0px;border:0;margin:0px;overflow:hidden;width:230px;height:205px;overflow:hidden; margin-top: 5px; margin-bottom: 10px;">Unsupported browser!</iframe></fieldset>
  267. <!--CALENDAR ENDS-->
  268.  
  269. <img src="https://i.pinimg.com/564x/ab/29/71/ab2971dc167d5bc786bc4a116507b6fe.jpg" style="width:220;">
  270.  
  271. </div>
  272. </center>
  273.  
  274. <body>
  275.  
  276. <!--MUSIC: Insert a .mp3 file in the <source src=""> quotations for autoplay music.-->
  277.  
  278. <audio autoplay loop id="mars">
  279. <source src="">
  280. </audio>
  281.  
  282. </body>
  283.  
  284. </html>
Add Comment
Please, Sign In to add comment