API tools faq
paste
Professor_Stein

Musherm

Professor_Stein
Jan 3rd, 2021 (edited)
52
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.23 KB | None | 0 0
raw download clone embed print report
  1. <style>
  2. @import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&family=Sriracha&family=Yusei+Magic&display=swap');
  3.  
  4.  
  5. body { background: #F8DCB5; overflow: hidden; cursor: url('http://www.rw-designer.com/cursor-view/112897.png'), default;}
  6.  
  7. .mainimg { z-index: 1; position: absolute; bottom: 0vh; left: 0vw; height: 60vh; width: 27vw; background: url('https://i.imgur.com/HHN6gLU.png') no-repeat; background-size: cover; filter: drop-shadow(.8vh .8vh 0vh #EFAF91); }
  8.  
  9.  
  10. .container { position: absolute; bottom: 3vh; left: 19vw; height: 45vh; width: 40vw; background: #FF9D90; border-radius: 10px; filter: drop-shadow(.8vh .8vh 0vh #CD6F65);}
  11.  
  12. .title { position: absolute; bottom: 40vh; left: 27vw; font-family: 'Dancing Script', cursive; color: #fff; font-size: 7vw; filter: drop-shadow(.8vh .8vh 0vh #CD6F65);}
  13.  
  14. .img { position: absolute; bottom: 30vh; left: 45vw; height: 10vh; width: 15vw; background: url('https://i.imgur.com/gfbEwXz.png') no-repeat; background-size: cover; transition: all .9s ease-in-out;} body:hover .img { height: 40vh; opacity: .8;}
  15.  
  16. .box1 { position: absolute; right: .5vw; bottom: 1vh; height: 20vh; width: 16vw; background: ; font-family: 'Yusei Magic', sans-serif; color: #fff; font-size: 1.5vh; overflow: auto; text-align: justify;}
  17.  
  18. .box2 { position: absolute; right: .5vw; top: 5.5vh; height: 20vh; width: 15vw; background: ; font-family: 'Yusei Magic', sans-serif; color: #fff; font-size: 1.5vh; overflow: auto; line-height: 2vh; }
  19.  
  20. .tabbox { position: absolute; top: 5.5vh; right: 17vw; width: 5vh; background: #fff;}
  21.  
  22. .one { position: absolute; top: 5vh; left: .5vw; height: 3vh; width: 1.5vw; background: #CD6F65; transition: all .7s ease-in-out; transform: rotate(30deg);}
  23.  
  24. .one:hover { transform: rotate(390deg); box-shadow: 0px 0px 5px #CD6F65;}
  25.  
  26. .two { position: absolute; top: 10vh; left: .5vw; height: 3vh; width: 1.5vw; background: #CD6F65; transition: all .7s ease-in-out; transform: rotate(30deg);}
  27.  
  28. .two:hover { transform: rotate(390deg); box-shadow: 0px 0px 5px #CD6F65; }
  29.  
  30. .three { position: absolute; top: 15vh; left: .5vw; height: 3vh; width: 1.5vw; background: #CD6F65; transition: all .7s ease-in-out; transform: rotate(30deg);}
  31. .three:hover { transform: rotate(390deg); box-shadow: 0px 0px 5px #CD6F65;}
  32.  
  33. .four { position: absolute; top: 20vh; left: .5vw; height: 3vh; width: 1.5vw; background: #CD6F65; transition: all .7s ease-in-out; transform: rotate(30deg);}
  34. .four:hover { transform: rotate(390deg); box-shadow: 0px 0px 5px #CD6F65;}
  35.  
  36. .info { z-index: 1; position: absolute; bottom: 1vh; left: 7vw; height: 37vh; width: 13vw; background: ; padding: 1vh; overflow: auto; opacity: 0; font-family: 'Yusei Magic', sans-serif;
  37. color: #fff8; text-transform: ; font-size: 1.5vh; line-height: 2vh; text-align: justify; }
  38.  
  39. .info:target { z-index: 100; opacity: 1; transition: all .7s ease-in-out; }
  40.  
  41.  
  42.  
  43.  
  44. U { text-decoration: none; text-transform: ; font-family: 'Sriracha', cursive;; color:#fff; font-size:1.5vh; letter-spacing:.1vh; transition: all .7s ease-in-out;}
  45.  
  46. a { text-decoration: none; color: #A2C4FA; text-transform: uppercase; transition: all .5s ease-in-out;}
  47.  
  48. a:hover { text-shadow: 0px 0px 5px #A2C4FA; text-transform: lowercase;}
  49.  
  50. ::-webkit-scrollbar { display:none;}
  51.  
  52. i { color: #C76D64;}
  53.  
  54. b { color:#E6E35F;}
  55.  
  56. ul, li {
  57. list-style: none;
  58. margin-left: -15px; margin-bottom: 5px;
  59. text-align: justify; font-size: 15px;
  60. }
  61.  
  62. li:before {
  63. content:"🞜"; margin-right: 5px; font-size: 15px;
  64. }
  65.  
  66.  
  67.  
  68. </style>
  69. <div class="mainimg"></div>
  70. <div class="img"></div>
  71. <div class="container"><div class="box1"><ul><li>code made for Mush by <a target="_blank" href="">scoob,</a> for their usage only. Please do not touch or take any part of the code.</li> <li> ooc bracket. add as many as you'd like, the box scrolls.</li> <li><i>italic</i> <u>underline</u> <b>bold</b> <a hover="don't put quotation marks, it'll break.">hover</a> <a target="_blank" href="">link</a></li></ul></div>
  72. <div class="box2"><u>Fun Fact</u> <span style="float:right;">Can Genderbend</span>
  73. <br><u>Name</u> <span style="float:right;">Mush</span>
  74. <br><u>Species</u> <span style="float:right;">Fungi</span>
  75. <br><u>Gender</u> <span style="float:right;"><a target="_blank" href="https://i.imgur.com/xaT2IuE.png">Feminine</a></span>
  76. <br><u>Orientation</u> <span style="float:right;">Anything c:</span>
  77. <br><u>Status</u> <span style="float:right;">Single</span>
  78. <br><u>Height</u> <span style="float:right;">5'8"</span>
  79. </div>
  80. <div class="tabbox"><a class='one' href='#one'></a>
  81. <a class='two' href='#two'></a>
  82. <a class='three' href='#three'></a>
  83. <a class='four' href='#four'></a></div>
  84. <div class="info" id="one">
  85. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id diam vel quam elementum pulvinar etiam non quam. Et malesuada fames ac turpis egestas sed tempus. Ut sem viverra aliquet eget sit. Massa massa ultricies mi quis hendrerit dolor magna. Sit amet mattis vulputate enim nulla aliquet porttitor. Ipsum dolor sit amet consectetur adipiscing. Netus et malesuada fames ac turpis egestas sed tempus. Eu consequat ac felis donec et odio pellentesque. Elementum pulvinar etiam non quam lacus suspendisse faucibus. Nisi vitae suscipit tellus mauris a diam maecenas sed enim. Dolor purus non enim praesent elementum facilisis. Habitasse platea dictumst vestibulum rhoncus est pellentesque elit. At auctor urna nunc id cursus. Consectetur adipiscing elit duis tristique sollicitudin nibh sit amet. Volutpat blandit aliquam etiam erat velit. Tempor id eu nisl nunc mi ipsum faucibus vitae aliquet. Eleifend mi in nulla posuere. Blandit volutpat maecenas volutpat blandit aliquam etiam.
  86.  
  87. Elementum nisi quis eleifend quam adipiscing vitae. Varius quam quisque id diam vel quam elementum pulvinar. Vitae et leo duis ut. Nec feugiat nisl pretium fusce id velit ut. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ultrices in iaculis nunc sed. Quisque id diam vel quam elementum pulvinar etiam non. Quisque id diam vel quam elementum pulvinar etiam non quam. Nec feugiat nisl pretium fusce id velit ut. Amet venenatis urna cursus eget nunc scelerisque viverra mauris. Hac habitasse platea dictumst vestibulum rhoncus. Aliquam id diam maecenas ultricies mi. Senectus et netus et malesuada fames ac turpis egestas sed. Adipiscing elit duis tristique sollicitudin nibh sit amet commodo nulla. Sed id semper risus in. Metus aliquam eleifend mi in nulla. Porttitor rhoncus dolor purus non enim. Aliquam malesuada bibendum arcu vitae elementum.
  88. </div>
  89.  
  90. <div class="info" id="two">
  91. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id diam vel quam elementum pulvinar etiam non quam. Et malesuada fames ac turpis egestas sed tempus. Ut sem viverra aliquet eget sit. Massa massa ultricies mi quis hendrerit dolor magna. Sit amet mattis vulputate enim nulla aliquet porttitor. Ipsum dolor sit amet consectetur adipiscing. Netus et malesuada fames ac turpis egestas sed tempus. Eu consequat ac felis donec et odio pellentesque. Elementum pulvinar etiam non quam lacus suspendisse faucibus. Nisi vitae suscipit tellus mauris a diam maecenas sed enim. Dolor purus non enim praesent elementum facilisis. Habitasse platea dictumst vestibulum rhoncus est pellentesque elit. At auctor urna nunc id cursus. Consectetur adipiscing elit duis tristique sollicitudin nibh sit amet. Volutpat blandit aliquam etiam erat velit. Tempor id eu nisl nunc mi ipsum faucibus vitae aliquet. Eleifend mi in nulla posuere. Blandit volutpat maecenas volutpat blandit aliquam etiam.
  92.  
  93. Elementum nisi quis eleifend quam adipiscing vitae. Varius quam quisque id diam vel quam elementum pulvinar. Vitae et leo duis ut. Nec feugiat nisl pretium fusce id velit ut. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ultrices in iaculis nunc sed. Quisque id diam vel quam elementum pulvinar etiam non. Quisque id diam vel quam elementum pulvinar etiam non quam. Nec feugiat nisl pretium fusce id velit ut. Amet venenatis urna cursus eget nunc scelerisque viverra mauris. Hac habitasse platea dictumst vestibulum rhoncus. Aliquam id diam maecenas ultricies mi. Senectus et netus et malesuada fames ac turpis egestas sed. Adipiscing elit duis tristique sollicitudin nibh sit amet commodo nulla. Sed id semper risus in. Metus aliquam eleifend mi in nulla. Porttitor rhoncus dolor purus non enim. Aliquam malesuada bibendum arcu vitae elementum.
  94.  
  95. </div>
  96.  
  97. <div class="info" id="three">
  98. <a target="_blank" href="https://i.imgur.com/ja3halt.png"> <img src="https://i.imgur.com/ja3halt.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  99. <a target="_blank" href="https://i.imgur.com/miNRnP1.png"> <img src="https://i.imgur.com/miNRnP1.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  100. <a target="_blank" href="https://i.imgur.com/uo1tpKI.png"> <img src="https://i.imgur.com/uo1tpKI.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  101. <a target="_blank" href="https://i.imgur.com/ZDes1aU.png"> <img src="https://i.imgur.com/ZDes1aU.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  102. <a target="_blank" href="https://i.imgur.com/Fj1VaQg.png"> <img src="https://i.imgur.com/Fj1VaQg.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  103. <a target="_blank" href="https://i.imgur.com/xaT2IuE.png"> <img src="https://i.imgur.com/xaT2IuE.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  104. <a target="_blank" href="https://i.imgur.com/7OkusAT.png"> <img src="https://i.imgur.com/7OkusAT.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  105. <a target="_blank" href="https://i.imgur.com/htDCAtg.png"> <img src="https://i.imgur.com/htDCAtg.png" style="width:45px;padding:4px;background-color:#fff6;"></a>
  106.  
  107. </div>
  108.  
  109. <div class="info" id="four">
  110. Satoshi Nakamoto launched lots of decentralisation when Litecoin required many decentralised application, for Augur limited some public key behind lots of multi signature. Blockchain thought some robust smart contract in a algorithm! Since OmiseGo bought few double spend, Augur could be many algo-traded vaporware, but Decred data mining few trusted hard fork!
  111.  
  112. </div></div>
  113. </div>
  114. <div class="title">Mush</div>
Add Comment
Please, Sign In to add comment
Public Pastes
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!