Advertisement
izuemis

cr anastasia

Apr 23rd, 2023
381
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.68 KB | None | 0 0
  1. -- FONTS --
  2.  
  3. @font-face {
  4. font-family: windows;
  5. src: url(https://dl.dropbox.com/s/cn0l1yjacta4whv/W95FA.otf);
  6. }
  7.  
  8. @font-face {
  9. font-family:'fenotype';
  10. src: url(https://dl.dropbox.com/s/klo6yfrf62916qp/02.10FEN.TTF);
  11. }
  12.  
  13. -- MAIN CONTAINER --
  14.  
  15. box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 20%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
  16. width: 65%;
  17. height: 8em;
  18. overflow: auto;
  19.  
  20. -- NAME --
  21.  
  22. font-family:'fenotype';
  23. position: absolute;
  24. right: 3em;
  25. bottom: 7.5em;
  26. text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff, 0 0;
  27.  
  28. -- BUTTONS --
  29.  
  30. border: 1px solid #261a19;
  31. box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 20%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
  32. font-family: windows;
  33.  
  34. -- INFO --
  35. background: rgba(255,255,255,0.5);
  36. border-radius: .5em;
  37. padding: 5px;
  38.  
  39. -- HIGHLIGHT / MARK --
  40.  
  41. font-family:'fenotype';
  42. text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;
  43. padding-left: 5px;
  44. padding-right: 5px;
  45. border-radius: 20px;
  46. box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 20%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
  47. border: 1px solid #261a19;
  48. margin-right: .25em;
  49.  
  50. -- MUSIC --
  51.  
  52. <head>
  53. <link rel="preconnect" href="https://fonts.googleapis.com">
  54. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  55. <link href="https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;800&display=swap" rel="stylesheet">
  56.  
  57. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  58.  
  59. <!-------MUSIC PLAYER BY GLENTHEMES------->
  60. <script src="//static.tumblr.com/gtjt4bo/QRmphdsdv/glenplayer02.js"></script>
  61.  
  62. <script src="https://kit.fontawesome.com/8119dfca45.js" crossorigin="anonymous"></script>
  63.  
  64. </head>
  65.  
  66. <style type="text/css">
  67.  
  68. @font-face {
  69. font-family: 'music';
  70. src: url(https://cdn.glitch.me/9bbfdfb3-4bfa-4c39-8743-5621c8b9df21/LL_RECOR.TTF);
  71. }
  72.  
  73. @font-face {
  74. font-family: Pixelated MS Sans Serif;
  75. src:url(ms_sans_serif.woff) format("woff");
  76. src:url(ms_sans_serif.woff2) format("woff2");
  77. }
  78.  
  79. /*-------MUSIC PLAYER BY GLENTHEMES-------*/
  80. #glenplayer02 {
  81. display:flex;
  82. background: #C2C2C2;
  83. padding: .2em;
  84. border: 3px solid;
  85. border-style: inset;
  86. margin: auto;
  87. margin-top: 0.5em;
  88. margin-bottom: 0.5em;
  89. width:auto;
  90. }
  91.  
  92. #glenplayer02 a {text-decoration:none;}
  93.  
  94. #glenplayer02 > div {
  95. align-self:center;
  96. -webkit-align-self:center;
  97. }
  98.  
  99. .music-controls {
  100. user-select:none;
  101. -webkit-user-select:none;
  102. width:13px;
  103. font-size:18px;
  104. cursor:pointer;
  105. font-family: 'music';
  106. }
  107.  
  108. .playy, .pausee {font-family: 'music'; font-size: .75em; color: #F38BC8; -webkit-text-stroke: 0.5px #000; margin-top: -0.2em; margin-bottom: 0.1em; } /* color of play & pause buttons */
  109.  
  110. .pausee {display:none;}
  111.  
  112. .sonata {
  113. margin-left:0.4em;
  114. font-family: Pixelated MS Sans Serif;
  115. font-size:0.625em;
  116. color:#000; /* color of music note symbol */
  117. }
  118.  
  119. .labeltext {
  120. margin-left:0.5em;
  121. position: relative;
  122. bottom:0.1em;
  123. font-size:14px;/* color of song title */
  124. }
  125.  
  126. </style>
  127. <body>
  128. <!-------MUSIC PLAYER BY GLENTHEMES------->
  129. <div id="glenplayer02">
  130. <div class="music-controls" onclick="songstart();">
  131. <div class="playy">d</div>
  132. <div class="pausee">k</div>
  133. </div>
  134. <div class="sonata">MP3 </div>
  135. <div class="labeltext"><img src="https://64.media.tumblr.com/tumblr_ll7wpyHlj71qi6qow.gif"> <span style="font-family: 'music'; font-size: 1.1em; color: #F38BC8; -webkit-text-stroke: 0.5px #000; margin-top: -0.2em; margin-bottom: 0.1em; ">o</span></div>
  136. </div><!--end music player-->
  137.  
  138. <audio id="tune" src="https://drive.google.com/uc?export=download&id=1_NHDLb9goEYZk8G7uWKY812j2JNqgpMu"></audio>
  139. </body>
  140.  
  141. -- CD --
  142.  
  143. <style>
  144. lol {
  145. }
  146.  
  147. .img1 { /* cd image u can change the size too */
  148. width: 5em;
  149. height: 5em;
  150. position: absolute;
  151. right: -1em;
  152. bottom: 4em;
  153. z-index: 800;
  154. -webkit-animation: spin 2s linear infinite;
  155. -webkit-animation:spin 4s linear infinite;
  156. -moz-animation:spin 4s linear infinite;
  157. animation:spin 4s linear infinite;
  158. }
  159. @-moz-keyframes spin {
  160. 100% { -moz-transform: rotate(360deg); }
  161. }
  162. @-webkit-keyframes spin {
  163. 100% { -webkit-transform: rotate(360deg); }
  164. }
  165. @keyframes spin {
  166. 100% {
  167. -webkit-transform: rotate(360deg);
  168. transform:rotate(360deg);
  169. }
  170. }
  171. .img1:hover { /* this makes the cd stop spinning when hovering! */
  172. -webkit-animation: pop 0.3s ease;
  173. }
  174. </style>
  175. <body>
  176. <div id="lol"><img class="img1" src="https://cdn.discordapp.com/attachments/822589056256311328/890714753780031488/image0.png" width="auto" height="45px"></div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement