marshallsmyth

LS Belladonna 7/5/20

Mar 23rd, 2019
355
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 39.42 KB | None | 0 0
  1. <body><style type="text/css"> @import url(https://fonts.googleapis.com/css?family=Allura|Parisienne|Paprika|UnifrakturMaguntia|Charm|Philosopher);
  2. ::-webkit-scrollbar-thumb:vertical { background:#209; }
  3. ::-webkit-scrollbar-thumb:horizontal {background:#709;}
  4. ::-webkit-scrollbar { width:0px; height:3px; background:black; }
  5.  
  6.  .clouds {position:fixed;left:0%;bottom:0%;width:100%;height:30%;
  7. display:inline;overflow:visible;pointer-events:none; opacity:0.8;
  8. background:transparent url('https://i.imgur.com/geosgmp.png') repeat top center;
  9. z-index:1; -moz-animation:move-scrolling-front 200s linear infinite; -ms-animation:move-scrolling-front 200s linear infinite;
  10. -o-animation:move-scrolling-front 200s linear infinite; -webkit-animation:move-scrolling-front 200s linear infinite;
  11. animation:move-scrolling-front 200s linear infinite; } @keyframes move-scrolling-front{from{background-position:0% 0%}
  12. to{background-position:300% 0%}} @-webkit-keyframes move-scrolling-front{from{background-position:0% 0%}
  13. to{background-position:300% 0%}} @-moz-keyframes move-scrolling-front{from{background-position:0% 0%}
  14. to{background-position:300% 0%}} @-ms-keyframes move-scrolling-front{from{background-position:0% 0%} to{background-position:300% 0%}}
  15.  
  16. body { background-size:827%; background-image:url( https://i.imgur.com/AgnZpAj.png );
  17. background-repeat:no-repeat;width:827%; }
  18.  
  19.  </style>
  20.  
  21.  <div id="1" class="genealogy"> </style> <style type="text/css">
  22. #box1 { width:24%; height:13%; left:0.0%; top:2%; position:fixed; overflow:hidden;
  23. transition:7s ease; padding:0px 5px 0px 0px; border:solid 4px #80f;
  24. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  25. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 3px #99f; font-style:italic;
  26. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  27.  #box1:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  28. border-radius:20px; border:dotted 7px #77f; box-shadow:0px 0px 20px 30px #8e002e;
  29. overflow:auto; color:transparent; padding:1px; font-size:20px; line-height:0px; }</style>
  30. <div id="box1"> Overview <div class="clouds"> </div>
  31. <img src=" https://i.imgur.com/egaMyvR.jpg " style="width:100%;"> </div></div>
  32.  
  33.  <div id="2" class="genealogy"> </style> <style type="text/css">
  34. #box2 { width:21%; height:13%; left:0.0%; top:84%; position:fixed; overflow:hidden;
  35. transition:7s ease; padding:0px 15px 0px 0px; border:solid 4px #80f;
  36. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  37. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; font-style:italic;
  38. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  39.  #box2:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  40. background:linear-gradient( to right,#001,#002 30%,#004 70%,#001 ); opacity:1;
  41. border-radius:20px; border:solid 7px #803; box-shadow:0px 0px 20px 30px #400;
  42. overflow:auto; color:transparent; padding:0px; font-size:0px; line-height:0px; }
  43. </style> <div id="box2"> <i>Belladonna</i> <div class="clouds"> </div>
  44. <div style="color:red;font-size:80px;margin:45px 0px 10px 0px;line-height:85px;">has a new baby with Kannachan, named Balla. must update</div>
  45. <img src=" https://i.imgur.com/Y9Ryhiq.jpg " style="width:100%;"> </div></div>
  46.  
  47. <div id="3" class="genealogy"> </style> <style type="text/css">
  48. #box3 { width:21%; height:13%; left:17.2%; top:69%; position:fixed; overflow:hidden;
  49. transition:7s ease; padding:1px; border:solid 4px #80f;
  50. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  51. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 3px #99f; font-style:italic;
  52. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  53.  #box3:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  54. border-radius:20px; border:solid 7px #50a; box-shadow:0px 0px 20px 30px #400;
  55. overflow:auto; color:transparent; padding:0px; font-size:0px; line-height:0px; }
  56. </style> <div id="box3"> Missions <div class="clouds"> </div>
  57. <img src=" https://i.imgur.com/eCjUkLQ.png " style="width:100%;"> </div> </div>
  58.  
  59. <div id="4" class="genealogy"> </style> <style type="text/css">
  60. #box4 { width:21%; height:13%; left:39.1%; top:69%; position:fixed; overflow:hidden;
  61. transition:7s ease; padding:1px; border:solid 4px #90f;
  62. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  63. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 3px #99f; font-style:italic;
  64. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  65.  #box4:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  66. border-radius:20px; border:solid 7px #50a; box-shadow:0px 0px 20px 30px #805;
  67. overflow:auto; color:transparent; padding:0px; font-size:20px; line-height:0px; }
  68. </style> <div id="box4"> Timeline<div class="clouds"> </div>
  69. <img src=" https://i.imgur.com/nfyEeA0.png " style="width:100%;"> </div></div>
  70.  
  71. <div id="5" class="genealogy"> </style> <style type="text/css">
  72. #box5 { width:21%; height:13%; left:61%; top:69%; position:fixed; overflow:hidden;
  73. transition:7s ease; padding:1px; border:solid 4px #80f;
  74. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  75. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 4px #99f; font-style:italic;
  76. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  77.  #box5:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  78. background-size:100% 99.5%; background-image:url( https://i.imgur.com/y6zbfvj.png ); background-repeat:no-repeat;
  79. border-radius:20px; border:dotted 7px #c682f9; box-shadow:0px 0px 20px 30px #8e002e,inset 0px 0px 20px 2px #203;
  80. overflow:auto; color:transparent; padding:1px; font-size:20px; line-height:0px; }
  81. </style> <div id="box5"> Inlaws <div class="clouds"> </div>
  82.  <img src=" https://i.imgur.com/kVpO9xz.png " style="width:100%;margin-top:6px;opacity:0.5;box-shadow:0px 0px 0px 0px #8e002e,inset 0px 0px 200px 200px #203;"> </div></div>
  83.  
  84. <div id="6" class="genealogy"> </style> <style type="text/css">
  85. #box6 { width:21%; height:13%; left:76.9%; top:84%; position:fixed; overflow:hidden;
  86. transition:7s ease; padding:0px 20px 0px 0px;; border:solid 4px #80f;
  87. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  88. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 2px #99f; font-style:italic;
  89. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  90.  #box6:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  91. border-radius:20px; border:solid 3px #50a; box-shadow:0px 0px 20px 30px #300;
  92. overflow:auto; color:transparent; padding:0px; font-size:20px; line-height:0px; }
  93. </style> <div id="box6"> Images <div class="clouds"></div>
  94. <img src=" https://i.imgur.com/8SwunlE.jpg " style="width:100%;"> </div> </div>
  95.  
  96. <div id="7" class="genealogy"> </style> <style type="text/css">
  97. #box7 { width:24%;height:13%; left:73.8%;top:2%; position:fixed; overflow:hidden;
  98. transition:7s ease; padding:0px 20px 0px 0px; border:solid 4px #80f;
  99. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  100. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 4px #99f; font-style:italic;
  101. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  102.  #box7:hover { width:99%;height:97.7%;transition:7s ease;left:0%;top:0%;z-index:1;
  103. border-radius:20px;border:dotted 7px #a8f;box-shadow:0px 0px 20px 30px #8e002e;
  104. overflow:auto;color:transparent;padding:1px;font-size:20px;line-height:0px;}
  105. </style> <div id="box7"> Background <div> <div class="clouds"> </div>
  106. <img src=" https://i.imgur.com/1tffTYT.png " style="width:100%;margin-top:0px;"> </div> </div>
  107.  
  108. <div id="8" class="genealogy"> </style> <style type="text/css">
  109. #box8 { width:21%; height:13%; left:39.1%; top:84%; position:fixed; overflow:hidden;
  110. transition:7s ease; padding:1px; border:solid 4px #90f;
  111. background:linear-gradient( to right,#104,#206 30%,#208 70%,#104 ); opacity:1;
  112. border-radius:50px; font-family:unifrakturmaguntia, times; color:#90f; text-shadow:4px 0px 3px #99f; font-style:italic;
  113. font-size:66px; line-height:99px; letter-spacing:2px; text-align:center; }
  114.  #box8:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;
  115. background:linear-gradient(to right,#100,#300 30%,#500 70%,#200); opacity:1.0;
  116. border-radius:20px; border:solid 7px #50a; box-shadow:0px 0px 20px 30px #805,inset 0px 0px 60px 20px #805;
  117. overflow:auto; color:transparent; padding:0px; font-size:20px; line-height:20px; }
  118. </style> <div id="box8"> Updates <div class="clouds"> </div>
  119.  
  120. <div style="font-size:164px;letter-spacing:-1px;text-align:center;color:#90f;margin:140px; 0px 0px 0px;
  121. line-height:144px;"> <i> Belladonna <br> WayStone-Smith </div>
  122.  
  123. <div style="line-height:41px;border-bottom:30px double #40a;color:#80a;font-size:90px;
  124. letter-spacing:3px;margin-top:340px;text-shadow:2px 0px 0px #40b;"> Updates </div>
  125.  
  126. <ul style="font-size:60px;color:#70c;list-style-type:square;text-shadow:3px 0px 0px #201;
  127. line-height:70px;margin:60px 60px -20px 60px;text-align:justify;">
  128.  
  129. <li> 2017 - <p>
  130. <li> 2019 - <p>
  131. <li> 2020 - <p><br> </ul>
  132.  
  133. <div style="line-height:41px;border-bottom:30px double #202;text-shadow:3px 0px 0px #40c;
  134. color:#80a;font-size:90px;letter-spacing:1px;padding-top:90px;"> Belladonna's Continuing Story </div> </i>
  135.  
  136. <div style="font-size:60px;line-height:66px;font-family:philosopher, times;text-align:justify;font-style:italic;
  137. padding:60px 30px 10px 30px;color:#a0e;"> <center> caption </center> <p>
  138.  
  139. <center><img src=" x " style="width:25%;border-radius:20px;padding-top:5px;box-shadow:0px 0px 50px 30px #30b;"></center>
  140. <p style="p:50px;">
  141.  
  142. <li> Typing <p>
  143.  
  144. </div> <div style="font-family:paprika, times;font-size:38px;line-height:52px;color:#108;text-shadow:2px 0px 0px #000;
  145. text-align:justify;padding:0px 48px 0px 48px;"><i>
  146.  
  147. <li> ... <p><br> </div>
  148. </div></div>
  149. <div id="end" class="genealogy"></style><style type="text/css">
  150. #boxend {left:41%;top:1%;opacity:1;font-size:38px;font-family:charm, sans-serif;color:#f44;position:fixed;}
  151. </style><div id="boxend"> Belladonna 5/14/20 </div></div></script></body></html>
Add Comment
Please, Sign In to add comment